Minor Project 10: "Don't Make Me Think"- Chapter 2

Scanning
As humans, we obey our instincts.  When you first open a website, what is the first thing you do?  Perhaps unknowingly, but your eyes scan the page to take everything in at first glance. Afterwards, you will break down the page.  Since we are the site designers, we need to take into account that the user will not be examining each and every piece of the page; instead, they will be searching for the button/link/info that they need! 


Satisficing
This is something a user does after they have scanned your page.  They will try to find the link to what they need, however they will choose the quickest, most obvious option; even if there is a chance it will be wrong.  They will choose without remorse, because if it is the wrong thing, they can automatically return to the page they came from. 

Minor Project 9: Wireframes

R.A. Wireframe 1

R.A. Wireframe 2

NHMA Wireframe 1

NHMA Wireframe 2

Minor Project 7: Thumbnail Sketches- NHMA

Minor Project 7: Thumbnail Sketches- Roadside Academy

Minor Project 8: "Don't Make Me Think"- Chapter 1

Steve Krug's first law of usability is pretty obvious, as it is pulled from the title of the book.  Don't make the user think! A website (or any design, really) should be simple to navigate, and easy to view quickly and efficiently.  If you design a website and place the navigation at the bottom of the page, the user will probably not realize where it is, since it's most recognized at the top or side of the page.  You don't want the user to have to decipher the page; you want them to click and search without even thinking about it.  If they do this, they are not getting frustrated or bored trying to find their way around your site.  This is what the first law of usability is all about. [KISS] KEEP IT SIMPLE, STUPID! 

Minor Project 6: Photoshop Mockup- "Into Thin Air"

Minor Project 3: NHMA Project Brief

Company

New Haven Manufacturers Association

Objective

NHMA wants a website that will convey how necessary manufacturing is in today's world.  They want to use the site as a way to draw in new members and make it easy for existing members to get information.  They also want to take advantage of today's technology, while keeping in mind simplicity.  Another important aspect, is they want to have a lot of backlinks to other sites throughout their own.

Look & Feel

The current available site for the association looks very dull and out of date.  The colors are dull and the overall look says "boring".  I do like that they have their "logo" constantly at the top of the page, and that's something I would keep, although I would definitely redesign their logo.  Although it is easy enough to navigate, they are not taking advantage of today's technology.

Plans for Design/Layout

My design layout would have one bold color throughout the site; probably a dark blue.  The pages would have a sense of a grid structure, to keep things organized.  I would like the homepage to have a main video embedded, along with some facts about manufacturing to draw in interested people, & current events going on with the program.  There would also be decorative links to the associations many social network pages. 

Type Choices & Typesetting

I would like to use a plain, simple typeface for the body of the page such as Arial or Helvetica.  For titles, and the logo, I would use a sans serif as well, but it would be bigger & bolder.

Visual Hierarchy

I would like the website to lead the viewer in, so the Header at the top will sport a brand new logo design, along with pictures relating to the association.  This will lead down to a Navigation Menu separating the different options:

• About
• Membership
• Events
• Legislative
• Education
• (Facebook, Twitter, Etc. located in buttons on the header possible)

Use of White Space

Because I want the page to show simplicity as well, there will not be a background color for the site.  It will actually just be white, with the addition of the elements that I've mentioned.  Certain pages will contain pictures with their information, as well.

Description of Color Choices

As I mentioned, I'd like to use a dark blue to showcase the strength of the company.  The light blue & yellow currently in use, make the site look like a nursery.  The deep blue will look a lot more professional.  Everything else will consist of black & white, or a variation of the blue (besides pictures).

Navigation, Ease of Use, Usability, Accessibility

The website will be extremely easy to navigate, especially for older users who may have trouble with computers.  The typefaces will be easy to read, and the menus will be easy to find and navigate.  I'm hoping to make my site, so that it is compatible with the form based system that NHMA is already using to input information into their site.

Target Audience & Demographic

The targeted audience consists of existing and future members of NHMA, & people interested in Manufacturing who want to know more about it.

Timeline 

I need to start sketching out layouts and details, then move on to wireframes, and a mockup in photoshop.  I'll use illustrator to make the logo, and possibly edit it in photoshop.  I will follow the class timeline as I do each step.

Model Sites

www.nam.org

http://www.nea.org/ - I love the look of this site, but if I implemented this design, it would be less cluttered, as NHMA is not as complicated an association. 

Minor Project 5:Don't Make Me Think: Preface, Forward, & Intro

What is the difference between interfaces, interaction design and information architecture?


The interface is the visual that the user sees as the website.  It is composed of Interaction Design, which is basically what happens next when the user clicks, and information architecture, which is how everything is organized on the site AKA the hierarchy. 


So far I really enjoy how Krug's book practices what he preaches! 


If it is short, it is more likely to be used

Minor Project 2: Roadside Academy Brief

When Dale presented, she stated her goals clearly--to represent her school as a fun, simple, succesful private academy, with the ability to be spontaneous and stand out from the crowd.  As a very small school, it's hard to get word out about how wonderful the program may be.  A website is supposed to acknowledge the small foundation that something may be built on, but give it the means to reach far beyond that.  The website is probably the first thing a prospective student/parent will see, and therefore, it must attract an audience.  


I would like my core creative message to show prospective viewers the fun side of the school, as well as the basics of a place such as this.  I want to keep in mind that Roadside wants to nurture their children, and so I will be using light tones of blue to keep the site soft.  Keeping Dale's preferences in mind, there will be drop-down menus along the top of the site. Please see (http://www.cathedralhighschool.org/index.jsp) for my design inspiration.  I would also like to incorporate pictures of field trips and fun things the kids do within the design of the website.  I'd like to keep certain pictures in the header of the page, but then have a separate slide show revealing more pictures.  The site would be simple so it's easy to navigate and hard to get lost.  I'd like to emphasize the uniqueness of the school itself by stating some of it's great qualities right on the home page.  


The logo (possible redesign) would be constant within the header, so the viewer always remembers what they're looking at.  The mascot will be on the page as well (redesign?), possibly as a footer, which would include a quote that sums up the academy.  


The site's navigation will be broken down as listed:

• Learn About Us!
• Our New Home
• Mission
• History
• Headmaster
• Testimonials
• FAQ
• What's Going On?
• Recent Activities
• Upcoming Events
• Roadside Winners
• Success Stories (Alumni)
• Academics
• Calendar
• Homework Blog
• Art Gallery
• Curriculum PDF
• Apply
• PDF of promotional Handbook
• Application
• Contact Us!
• Info
• Directions