• Looking for a Top Flight Web Development Team?
  • Professional & Affordable Web Design Services
  • Shaping Imaginations using Cutting-Edge Technologies
  • Dynamic Solutions for Dynamic Businesses
  • Analysis.. then Solutions with a High Tech Flair
  • Satisfied Customers In Over 30 Countries
  • National Association of
    Accredited Internet Professionals
  • (561)948-6074
Custom Website Designs
 
Visual Designing
  • Visual Design
    This web design lesson explores visual design and the methods used to develop Web site storyboards and screen creation. This process is a critical step in the Web portfolio design process because it enables visual persuasion and allows for a cohesive composition throughout the product. Many Web portfolio sites are poorly designed visually. The reasons surrounding this are too many to be discussed fully in this text. However, we will take a proactive approach and explain the qualities that are important in good visual design of Web pages. In addition, we will look at some bad Web portfolio design attributes to get a sense of what is not quite effective when it comes to visual persuasion. The notion of bad design is...

  • Tommy Spero’s portfolio
    Looking at designer Tommy Spero’s portfolio, www.soultooth.com, you see the identity of the designer shines through. The Web portfolios style is highly effective and meets the goals of the author by explicitly reaching out to a targeted audience of advertising agencies and high-end design shops. The site is unique because it does target the user by specifically presenting categories relating to the user. The main navigation categories include: on-air, online, off- line, and contact. From the start, this site is easy to understand and easy to navigate. Usability is high due to an integrated interface that provides a wealth of work that is easily viewed and easily accessed. The interface is elegant while somewhat...

  • Composition and the Web Portfolio
    Speaking in visual terms, composition is the arrangement of elements to create an effective visual product. The proximity, weight, continuity, scale, and repetition of items in a Web page have an impact on how the page is perceived and acted upon. Composition takes these factors into account. By giving the user a well thought-out composition, the pages and interface structure become transparent and the user can intimately focus on your content. So like naviga- tion, composition is seen by the author and is natural to the user. When composition is flawed or inconsistent throughout Web pages, it causes the entire Web portfolio to suffer. Composition brings all the elements together. Imagine you shot five photo- graphs: these are your...

  • Negative Space
    If we talk about actual space, we must balance it out by covering the concept of negative space. Negative space refers to the empty space within the actual space. It is void of objects and elements. Its usage is vital to proper visual design. It is always the starting point for our design. It may be a blank piece of paper or a new file in an application ready for content to be placed. When you begin to create a Web screen in Macromedia Fireworks, you begin with negative space. Negative space also goes by the name white space. The term white space was coined in traditional 2D design. It is a frequent term in graphic design. In Web design, white space is just as important to composition as content is...

  • Continuity
    Continuity is a term that is defined as consistency and adherence to structure. Continuity within the Web portfolio relies on keeping pages in the designed site structure. Technical snafus sometimes cause us to let continuity fail. For example, if we forgot navigation item after we were well into the design what should we do? Should we throw in anywhere? Or, should we redesign the navigation to integrate the missing piece? Sometimes we can add last-minute items and navigation to the Web page. In most cases doing this will disrupt continuity. Therefore, it is important that we establish continuity and consis- tency before we spend the bulk of our time physically creating completed Web pages. As a rule, you should not move navigation items to accommodate content. Establish minimum and maximum content...

  • Metaphors and Image Maps
    Metaphor can be a productive conceptual tool for visual communication. Use of metaphors in visual Web design is quite popular, definitely on home pages. When we use the term metaphor and image map we are referring to image based navigation systems employed in Web pages. Metaphors provide theme based image maps with contextual value. Metaphors must have meaning. The image map/metaphor will guide the user action. For this to happen, the user must be familiar with the metaphor (Kristoff & Satran, 1995). Identity Identity is a crucial element to developing a strong visual relationship with the user. Personal touches whether business worthy (a department logo) or not (your hiking photo), should be part of your sites overall...

  • Storyboards
    Now that we have discussed some of the visual principles and elements that are important to the look and feel of the Web portfolio, let’s create a rough draft of how we want the information to look on the Web page. More importantly, we should make notes on the drafts of what multimedia, navigation, and visual elements we want to include in the page design. Also, we should create a rough draft of all types of pop-up windows that exist in our site. The drafts that I am referring to are storyboards. In simple terms, the storyboard blocks out a set of actions for each screen, what the user sees when arriving at the Web page, what navigation or other controls are available when the user gets there, and the sequence in which events will occur (Kristoff & Satran, 1995). Creating the storyboard does not require intense...

 

 

Back
to Top