Minor Project 18: Static Web Page Mockups Part 1

Partner: Melissa Gaines

Minor Project 17: Schematic/Site Map Due 10/26

Partner: Melissa Gaines

Minor Project 16: Major Project brief. Client: Professor Brian Noell, EN102 "Mimesis"

Partner: Melissa Gaines


The Core Creative Concept: Simple and clean design that showcases the students work and makes it accessible to the online community. It will have navigation that will lead to each topic that the students are responsible for.  There will also be a side navigation that breaks down the topics further. The students will be able to edit their own work as well as upload images and videos to support it.  

The Overall Look & Feel: The website will have a classical and older feel.  The design will highlight the students’ work and relate to the content of the class. The color scheme will be filled with light colors such as tans greens and grays. 

Purpose & Objectives:  The purpose of this website is to give the students a place to collaboratively place and display their work.

Information Architecture: We will be using a template through drupal that gives us the opportunity to drastically edit it and to allow for the Professor and students to easily access and change their work.  The website will include the typical header and footer.  There will be two forms of navigation, primary and secondary.  The right hand side bar will contain media placed by the students that relate to their work. 

Audience: The primary audience for this site is Professor Noell and his students.  In the future the goal is to have it become a source of information for the public and possibly be supported by the Quinnipiac University Library.   

Design Visuals & Hierarchy: The typography used for the site will be Times because it has the old and scholarly feel while also being readable.  We will use a decorative serif for the header. Under the header will be a horizontal navigation bar that will have the most important links.  There will be a second navigation in a left hand side bar that will break the main navigation’s topics down further. These navigations will use the same typefaces in order to make the viewer categorize them together.

Schedule for implementation:

October 26th - Design brief Sitemap & mockup presentations

November 2nd – Final Designs

December 7th - Completed Website

Layout Inspiration:

Color Inspiration:

Template:

Minor Project 15: Read & Blog Chapter 3

In Steve Krug's Don't Make Me Think: A Common Sense Approach to Web Usability he discusses designing web pages for scanning and not reading.  He lists many different ways to achieve this goal such as creating a clear visual hierarchy and breaking up pages into clearly defined areas.  I think those are 2 of the more important points that he discusses in chapter 3 because they set the tone for everything else.  Creating a clear visual hierarchy makes sure that the most important things on the website are read first.  Also, by making things that are related look uniform, it makes it easier for the user to navigate quickly.  He goes on to say, "A good visual hierarchy saves us work by preprocessing the page for us, organizing and prioritizing its contents in a way that we can grasp almost instantly."  The second point that Krug makes that I think is very important is breaking pages up into clearly defined areas.  Using a well defined grid makes everything more visibly grouped.  People can quickly figure out which information is useful to them and know that everything contained in that same area could pertain to them as well.

Minor Project 12: Schematic/Site Map

Minor Project 14: Read & Blog

In Chapter 2 of Don't Make Me Think by Steve Krug we learn 2 key terms in web usability.  Both scanning and satisficing are very important to know when designing for the web.  We do not realize how often people only scan the content on the page rather than reading it thoroughly.  This is why when designing for the web you have to make sure your links and content have clear meanings and should stand out.   I am always in a hurry and doing a ton of things at once so when I go to a website I try to do things as fast as possible or I am doing something else as well so it does not get my full attention.  I know when I go to a website for a specific purpose my eyes almost "glaze over" until I see something that resembles what I am looking for. Which brings me to the topic of satisficing, which Herbert Simon defines as a cross between satisfying and sufficing.  Like I mentioned before, when a person finds a link that might lead them to where they need to go, they will click it without looking for a better option further down.

Minor Project 11: HiFi Wireframes Client Prof. Tracy Van Oss

Minor Project 10: Project "Brief" Client Prof. Tracy Van Oss

The Core Creative Concept: Simple and clean design that reflects Tracy's work in the medical field. It will have navigation that will lead to learning more about what Tracy does, who she is, and how to contact her.  Also the option of viewing images and videos will also be available throughout the website in order to really draw in users. 

The Overall Look & Feel: The website will be casual, calm and inviting. It's sleek design will represent the work that Tracy does. The color scheme will be filled with cool colors such as blues, whites, teals, and beiges. 

Purpose & Objectives:  The purpose of this website is to give Tracy Van Oss a hub that encompasses all of her work into one place where she could direct her clients to. 

Information Architecture: The website will contain a header that will have Tracy Van Oss in an interesting and appropriate type face, as well as her company name but in a smaller font size. Under the header will be a horizontal navigation bar that will have links to Home, About us, Bio, Events, Classic Care, Child Safety, Home Modification, Aging in Place, & OT in the Community. Although we are placing Tracy's contact information in the footer of the website, and her About Us page briefly, it may be important to also have a Contact Us page just incase a user is visiting the website specifically to find out contact information. If a user is coming to the page to do this, it's important that they don't have to navigate through all of the different pages to find this information. Having a Contact Us page will make it clear to the user where to click to receive the information they came to the site for. The website will be media heavy in order to draw in users. Lastly there will be three pages in the site (Ot in the Community, Aging in Place, and Child Safety) that will contain external links leading to outside websites. 

Audience: The audience for Tracy's website will vary according to page. Aging in place will be geared toward the elderly or people who are concerned with the elderly (children of the elderly or grandchild of the elderly) who are looking for a solution that will help allow them to remain in the same house safely. Child safety will be geared towards parents or guardians who want to keep their children safe from ever day hazards. Home modification will be geared toward either the elderly, people with disabilities, or parents/guardians with children trying to make their home safe. 

Design Visuals & Hierarchy: The typography used for the site will be a simple sans serif web-safe font, possibly verdana. The navigation will be in horizontal form which will have Tracy's name in a large font with her company name underneath in a smaller font. 

Schedule for implementation:

October 5th - Design brief and high fidelity wire frames

October 12th - Sitemap & mockup presentations

December 7th - Completed website

Inspirational website: http://www.nobelbiocare.com/en/home/default.aspx

inspiration for navigation