Saturday, July 28, 2012

Unit 3 reading 07/28


When entering a website its visual cues are important, and navigation is the key component in a site. It is the site and how it is organized. A poorly organized site isn't likely to keep you motivated to keep looking, or to bring you back to the website. 
          Organization on a web site is similar as the organization in a store. There are main sections then there is the subsection within the main section. As you look through each section but don’t find what you are looking for you restart the process. If the process seams too daunting you can ask, or in this case on a website you can use the search bar. Search bars have a delicate standard you don’t want to have a search bar to find the search bar. People on the site are scanning for the word search, avoiding other similar words is appropriate.
          In some case, like with a small website there is no need for a search bar. Using tabs as an indication of what page you are on is great, but it isn’t strong enough. You need to also have a title on each page. People can normally guess that the logo or ID is the link to the home page up a very plain out “home” is helpful to place under the ID. Navigation should remain constant it tells you where you are and where you have been from page to page.
          If you use tabs instead of buttons make sure that they are used as tabs. Many people use tabs before. By differentiating them and making one look prominent helps the user know where they are in the website. “You are here” indications are an easy way to show where the user is and where they have been and it is a great way to go to a previous page, or all the way back to the home page.  


And yet again more Inspa-rati- ÓN











Friday, July 20, 2012

Wk 2 Reading 07/20


Ch 3, 4, & 5

Face the Facts 
Ch3
            Five things to do to make users see and understand a web site;
·         Clear hierarchy on each page 
·         Take advantage of the conventions
·         Beak up pages into different areas  
·         Make what’s click able obvious
·         Minimize noise
Hierarchy can be portrayed in different ways; the important thing stands out and things that are related have the same level of hierarchy. Grouping, same visual style, clearly defined areas can also give this feeling of relation. Elements that are “nestled” visually show how things are related. Hierarchy organizes and prioritizes content. Without hierarchy it becomes slower to scan and makes us have to prioritize content on our own.
            When a phrase is in a larger type it is a headline and summarizes the content under it, and a picture with text below is either the caption or credits. Conventions continue to be used and develop over time. The conventions from the web have derived from news papers and magazines. The adoption of a convention takes time, the more well known the more users are familiar with the convention. Designers often want to create their own convention this is only innovative if the idea is better or leave it alone.
            By glancing around a page a user should be able to point out the areas of the page. A clear division helps the user decide where they want to go. Users decide quickly where the useful information is and avoid areas they don’t need.
            It is important to indicate what is clickable to not disturb a users flow. When there is no contrast of what is clickable forces the user to have to think to rearrange for a different pattern. Buttons on the search bar has to look like a button. With only visual cues, it still requires thought. A triangle is an indication of “clicking here” but it has to be aimed for what is clickable to make sense.
            Limit noise from the busyness of a page and to the back ground noise. Different users have a different tolerance level for noise. When designing assume every element is visual noise until made otherwise
.
Ch4 
Web Designers and Usability Professionals

Wide vs. deep site hierarchy
Wide- more catigories at each level but with fewer levels
Deep- more levels but requires more clicking with fewer options
Some sites have a standard amount of clicks (3-5) to go to any page on the website. A click isn’t really what matters it’s how involved each click is. Users don’t mind the clicks that they know are going to get them to where they want to go. They just want to be on the right track. “Three mindless, unambiguous clicks are equal to one click that requires thought” –Jared Spool
Unclear choices create questions; the choices need to be mindless in order for them to be easy to use.

Ch5
Of the Five or Six Things I learned

E.B White’s seventeenth rule from The Element of Style
17. Omit needless words
Words that take up space should be avoided; these words are unnecessary and make the site look daunting. Remove half the words you where originally going to use. This reduces the noise level, makes the useful words more prominent, and shortens the page making it easier to see each page at a glance. Happy talk and instructions should be limited if used at all. People would rather “muddle through than to read the instructions.   

Sunday, July 15, 2012

Web Site sketches 07/15

Here is an idea for a layout of my portfolio website, it high-lights some of my work as a big picture with the navigation being at the top of the screen. Smaller pictures at the bottom of the page to return back to previous projects. I decided not to go with this one because it would be hard to integrate this layout between pages. 

I decided to work with this layout because it is simple to read and changes can be made from page to page while keeping this layout. 


Concept Statement 07/15


Users that may visit my site:
Prospective clients and customers
Future employers
Friends
Other graphic designers

What does the type users who visit the page want to see to have a good experience visiting my site?
My work
Projects that I’ve completed
My contacts

Name your intended audience
Clients and customers
Future employers

Work categories
Illustration-Creative images, techniques
Layout- business cards, posters, calendar
Type design- Type
Identity- Logo
Misc.

Describe what you need to inform and persuade them of:
I want to promote my work and the creative solutions that I have come up with in recent projects. My goals is to keep it updated and have constant viewers, and people who can enjoy the site as a whole and get a feel of how I work and my style. My overall message is that I am open to new things and dedicated to each project. I want to change and develop from each solution I come up with and grow as a designer, and exceed expectations.

Concept statement:
On my portfolio site I want my work to come before anything else and be show cased on this website. I want a scroll over device to be used on each image/ piece. Shaded areas will show some information that can be taken in at a glance. If further information is desired the user can click on the image and be taken to a full display page.
I want the navigation and all other elements on the page to me aesthetically pleasing and go along with my portfolio pieces, but not over shadow them. I want the layout to be intuitive and make sense as the users create an experience with the website and build interest in my work.

List of assets needed to persuade the user:
Personal business card- Layout, illustration, photo, description
Type Illustration- Vector rendering, type based, process, description
Superior Evergreen- vector logo, Identity, description
Youtube Calendar- Layout, illustration, Description
Reborn Tattoo Logo- Vector logo, type, illustration, description
Reborn Tattoo website- Layout, illustration, photo, Description
Poster design- Layout, Illustration, icons, Description
Article Illustration- Illustration, Description
Shock Top infographic- Layout, Illustration, PDF, description

Mood Board


I want my website for my portfolio to show my creative side in a professional way. I used a lot of natural elements and mixed with created elements to give this feeling of familiarity. I used this sense of sky as a way to show imagination but with an elegant undertone. 

Friday, July 13, 2012

Wk 1 Ch 1&2 Why Mood Boards Matter 7/13

Inspiring Portfolio Websites; 

Erik Marinovich's Portfolio
In Erik Marinovich portfolio he show cases his type and lettering designs in a sleek and simple way. The whole layout is nice and clean and easy to fallow. 
Erik Marinovich Portfolio

BrandClay Portfolio
I like how Brandclay is easy to go through. The layout is straight forward and I love the style that you see in both the pieces in the portfolio and the website itself.
Brandclay Portfolio


In Dan Sweet Design portfolio all the graphic elements come together and show this rough side of design but the elements don't distract from his work. The navigation is easy to follow and the website feels very open Dan Sweet Design's Portfolio
Dan Sweet Design Portfolio

I really like the scrolling feature in Heck House's portfolio, it's almost like a time line for all of the projects while also giving some detail about each one. You can really get a feel for the retro type that is used and how it is incorporated in the different pieces.Heck House Portfolio

Heck House Portfolio
This portfolio is very inspiring, it has a different kind of viewing structure. The work pieces sway either left or right and makes it easy to go threw each project. D-NYCE Portfolio

I really like how the navigation on this website doesn't move when you scroll. Having this fuction makes it easy to look at and is also pleasing to the eye.Jas Hands. com Portfolio


Jas Hands Portfoli







D-NYCE Portfolio







Article;
I some how came across this article about things to think about when putting together your portfolio; Portfolio Help  


Why Mood Boards Matter
Mood boards or inspiration boards are used as a tool to show a client that there is an understanding of where the project is going. Mood boards communicate a visual and tells the client that it's understood what they are looking for. Creating a mood board prevents confusion and it helps the client get involved from the very beginning, to makes sure time isn't wasted on an undesirable look and feel.
  Mood boards are used to show a look, feel, and an atmosphere and is a cluster of elements that come together. The process of creating the mood boards comes after the wire framing and before the mock-ups. The elements that are usually shown on mood boards are photography style, color palettes, typography, patterns, and look and feel.

  There are two kinds of mood boards, the loose collage and a refined style guide. The collage is quick and time effective. You can add screen shots of other sites as reference. But this kind of mood board may be difficult to understand and some elements may be distracting.In a refined style guide the elements are pretty detailed and formal.This kind of mood board is clear and concise and to the point.


When starting the mood board its best to have a clear idea of what need to be shown in the elements. Writing down adjectives will help control the mood board in a way that is desired. When presenting the mood board to a client it is important they know that this stage in the process is required. Make sure that the client is aware that their input is welcome and will help you get an idea of what they are looking for. 
Letting the client know the reason why you picked each element will discourage them from personal preferences. Remind the client that nothing is set in stone yet and that mood boards are just a tool to make a quick decision to make a quick turn around. 


Chapter 1 and 2
One of the major thing surrounds making sure that your user gets the picture about your website, and gets where they want to go. In the book it's suggested;

  •  to use only half the words you where going to, then half of that. 
  • People need sites that are self-evident, obvious, and self-explanator
Main idea is to get rid of the asking questions, a user can feel loaded down with questions of how to navigate the site making it harder for them to get where they are going.


 The titles of links need to be obvious if it seams like it could be something else it could be assumed. Also things that are clickable need to be shown so to avoid confusion. To make a search box easier it shouldn't ask the user how they want to search, it will only complicates things. All the sites components should be recognizable instantaneously. 

Users may not always move on quickly, but either way an easy site makes everything seem better. when there is less unimportant things available it leads to an effortless navigation through the site.

  •  Less time goes in to looking at a web page then we think.
  •  Only an effective website is able to work instantly at a glance.
 The way we think people use a web site is different then how they actually use a website. Users generally; 
  • glance at each page
  • only scan limited words
  •  portions of the page aren't even seen.
 This is normally dependent on the kind of page it is, what the user is trying to do, and how much of a hurry they are in. 
Very little time is spent reading, the only words that are read, are the ones that catch out eye. Users only read up to a few paragraphs or print out an article because it's easier on the eye. The reason why we scan is to save time, in a hurry, or just want to keep moving.We know we don't need all of this information, we know we can get away with only a fraction of what is there.We want to only read the relevant tid-bits that we find, and we are good at this. Mainly when we scan we look for certain words and phrases or trigger words 


Users don't often time wait for the best option but rather the first reasonable option to save time. 

  • Because they are in a hurry 
  • There are no negative effects of guessing wrong 
  • No improvement of chances of looking for the best option
  • Less work 
  • The right guess makes it go faster 
We don't figure things out, especially if we know of a way to get what we want done. People will use things even if they don't completely know how to use them. Users rarely even read through instructions. Even I use search engines to go to a web site I've visited many times but for some reason went I want to go to dictionary.com I might just go to Google first. That's just they way my mind works it seems faster when I'm on the web to do what is familiar. The reason why we don't seek out easier ways to do things is because it out right means nothing to us. We don't even think about it. We rather to it a hard way, we discover an easier way that's cool to but the user isn't going to look for it.When a user is comfortable and confident and feel smart when navigating a website they are even willing to come back and keep using the web site.