Wireframing
Upcoming SlideShare
Loading in...5
×
 

Wireframing

on

  • 4,246 views

Wire Framing a Website

Wire Framing a Website

Statistics

Views

Total Views
4,246
Views on SlideShare
4,243
Embed Views
3

Actions

Likes
3
Downloads
105
Comments
0

2 Embeds 3

http://www.slideshare.net 2
http://dschool.co 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Wireframing Wireframing Presentation Transcript

    • Ramjee Ganti http://sodidi.blogspot.com Wireframing your Website
      • “ Change is the only Constant ”
      • "If you fail to plan, you plan to fail"
      • In web design , wireframes are a basic visual guide used to suggest the layout and placement of fundamental design elements in the interface design
      • Wireframes also allow for the development of variations of a layout to maintain design consistency throughout your site.
      • Act as a communication tool to clients and stakeholders.
      • Helps to define the positioning of global and secondary levels of navigation in a prominent and intuitive position.
    • Sitemap before Wireframe
    • Create the Wireframe
    • Add Content
    • Layout the Page
    • Is that It?
      • Not Yet!
      • Real people don’t understand wireframes
      • Visual affordances, such as color and underlining links are key to using a site, and these cues make a significant difference in a usability test.
    • Visual Cues
      • Color, which identifies hyperlinks and focuses the user’s attention on an element of the page
      • Branding, which confirms that the user knows where they are
      • Recognizable web page elements, such as forms and search fields
      • “ Content,” such as account numbers or product names, which allows experienced users to focus on how they would really use the page, instead of interpreting “lorem ipsum”
    •  
    •  
    • ?
    • Sources
      • http://www.alistapart.com/articles/avoidedgecases/
      • http://www.boxesandarrows.com/view/real_wireframes
      • http://www.sitepoint.com/article/wire-frame-your-site