This week we primarily improved on our initial design comps. In addition to that, we learned how to create slices and we started our starter HTML page. In order to start our HTML page, we had to learn how to code in Dreamweaver and manage CSS. Basically, this whole week was dedicated to the progression of our final project. There wasn’t much in terms of learning this week but a ton of work was done. I learned how to do so much both Photoshop and Dreamweaver this week. Working hands-on with my own work really helped me solidify my knowledge of CSS and HTML. Also, in Photoshop, I was given great feedback and I learned a lot from that. I now approach my design comp much differently. Let’s hope that this week will be a “get ahead” week with the Thanksgiving break approaching! Happy Thanksgiving in advance!!!!
Week 11 Summary
This week, we worked on our design comp. A design comp is basically your web page layout with your background, logo, color scheme font, etc incorporated into your wire frame. This is basically how our websites will look. It is simply the webpage without the navigation. We also learned how to do a variety of things on Adobe Photoshop. For example we learned how to create bevels, drop shadows, and strokes. We took all of this and incorporated it into our web design comp or mockup. We did this by learning how to create buttons, media placeholders, navigation, photos, etc. Basically we were given all of the necessary skills to create a perfect mockup for your web page.
This article was given to us:
Week 10 Summary
First and foremost, this week, we viewed a video on common mistakes when making a web page (see link below). We were also directed to 3 articles that pertain to web sites and how to create wire frames. Most importantly this week, we continued our final project. We created the wire frame document. This is a great outline of how our web site will look. This was a long week for us due to Hurricane Sandy but luckily I took a couple steps forward during my time off.
http://tv.adobe.com/watch/max-2008-design/common-mistakes-print-designers-make-on-the-web/
http://www.alistapart.com/articles/dao/
http://www.smashingmagazine.com/2011/06/06/planning-and-implementing-website-navigation/#more-96551
Week 9 Summary
This week was almost completely dedicated to our final project. We created a design document which includes a storyboard, flowchart, and project profiler. We also created a Style Tyle Creation. This is a picture that shows the fonts, themes, backgrounds, etc. for your web site. This week we made great strides in our final project.
Week 8 Summary
This week, I learned a few things that are necessary for our final project. I learned about Getty Images. To be honest, I had no idea what the site was so it was cool to interact with a new site. Getty images has many options when looking for images. The biggest option is whether you want a rights managed or royalty free image. Outside of our introduction to Getty Images, we refined our final banners and submitted them to the school and class. We also started our next portion of our cumulative final project. This week we had to fill out a “project profiler.” This project profiler was filled with questions about every aspect of our web site. We had to answer all of the questions and supply some sites that fit the criteria for what we wanted to do according to many categories. For example, content, graphics, functionability, etc. Overall, this week was a very accomplishing week. I was able to finally finish my banner and take another leap on my final project.
Week 7 Summary
This week, the main thing we learned how to do was create animated images. Most .gif files these days are animated. We then applied these animations to our banner project. My banner had leaves blowing in the wind in the background. To help with this, we learned how to move, duplicate, and clone objects. The easiest way to copy objects is with the copy and paste keyboard shortcut (Ctrl + C and Ctrl + V). Another thing we learned to do is mask objects. You can mask objects by drawing transparent shapes around the object. Then you can do a plethora of things with the mask properties. The next thing we focused on was symbols. We learned how to create graphic symbols and animate them. To create them, its as simple as right-clicking on the object then selecting “Convert to Symbol.” Then you can select a basic or animated symbol. While using animated symbols is rare, it is very neat and useful. This week we officially started our final project. We had to start the process of creating Morgue Files if our idea was accepted. My new plan is to create a website for my mom’s infant loss support group. I think she is excited more about the site! I love working with .gif images and this week was quite possibly the best week for me. It’s nice to know how to create animated .gifs!!!!
Final Project Idea 1
My first idea, since I don’t have any personal groups to create a website about, is to create a site for a made up business. I don’t know if we’re allowed to do so but I feel like I could have a lot of fun with creating my own site for a made up business.
Week 6 Summary
This week, we worked more on our banner assignment. We learned how to use Fireworks a little more as well. We worked on some more ways to draw with Fireworks. For example, using styles and styling with patterns and textures. We also learned how to work with objects in Fireworks. We did this by aligning and distributing elements, moving cloning and duplicating, and reshaping with the path panel. Most of the learning this week with Fireworks was hands on experience when working with our banner assignment. The best way to learn is trial and error with this software, in my opinion. We also learned a few more things about DreamWeaver. We learned how to work more with images in DreamWeaver and we also learned how to create a new HTML document. Overall, this week was a good week, however it was very long for me. I fell behind for a major reason and hope to get 100% caught back up this week!
Week 4 Summary
This week, we started going into depth on CSS and how to use a CSS style page. First we were taught how to use class and id selectors. Class selectors can be used more than once with the same name while id selectors can only be used once with a unique name. These selectors are put inside the tag of the portion you want it to apply to and they change everything that pertains to style in that section. We also learned about common conflicts with CSS such as inheritance and cascade. Also with CSS, we were able to change font family, size, and weight. Styling container is another thing we were taught. We learned how to add borders, spacing, and padding. We also built an understanding of the box model and how to make tables. Another successful and progressive week in Web Design 1.
Week 3 Summary
This week I learned how to use CSS and add images to web pages. CSS is a way to optimize your web site and customize it in many ways. With CSS codes, you can change the color, format, and text face of every part of your web page. CSS is a predefined set of rules acting as a language that instructs the web browser and communicates with the HTML file. I previously knew basic HTML but never encountered CSS. CSS makes customizing your web page much easier. I also learned how to optimize images so that they can be used on a web page. For example, I learned which file is most suitable given a certain situation. Also, this included how to physically put the picture in your web page. This week was a nice learning week because I happily found shortcuts and ways to make your web page look that much better.
Our professor gave us this link for visual hierarchy:
http://webdesign.tutsplus.com/articles/design-theory/understanding-visual-hierarchy-in-web-design/
Brenden's Learning Log 