Difference between revisions of "Design and Prototyping"

From DevSummit
Jump to navigation Jump to search
 
(9 intermediate revisions by one other user not shown)
Line 1: Line 1:
 
Start with a branding style guide
 
Start with a branding style guide
  
Planning ahead of time
+
2 different ways of building a branding style guide : '''Wireframing vs. Prototyping'''
  
Prototype is the fastest way to validate an idea
 
  
Wireframing vs. Prototyping
+
* Wireframing > Sticky notes > Agreeing on structure and what goes on each page
  
Wireframing > Sticky notes > Agreeing on structure /what goes on each page  
+
* Prototyping > Coding > Show you what's on each page > Allows you to show to client > Save time > a tool for buy-in
  
Prototyping > Coding > Show you what's on each page > Allows you to show to client > Save time > a tool for bye in
+
* The more traditional workflow is : designing > developing > re-designing > re-developing. Prototyping allows you to do that
  
More traditional workflow :
+
* Hard to develop a plan : planning vs. making
designing > developing > re-designing > re-developing
 
  
Prototyping allows you to do that
+
Prototyping is the fastest way to validate an idea
  
static site generators
+
Possible to use a static site generators e.g. metalsmith
  
planning vs. making
 
  
static site generators -> metalsmith
+
* Having conversations early -> if you know how drupal will spit out -> develop CSS file to structure
  
having conversations early -> if you know how drupal will spit out -> develop CSS file to structure
+
* Psychological tool -> making them think they're in good hands -> first site looks good while not putting in too much work
  
psych tool -> making them think they're in good hands -> first site looks good while not putting in too much work
+
* Be intentional about the design and design a framework before you code half
  
be about the design . design a framework before you code half
+
[[Category: 2015]][[Category: Usability]][[Category: Workflows]]

Latest revision as of 21:40, 22 November 2016

Start with a branding style guide

2 different ways of building a branding style guide : Wireframing vs. Prototyping


  • Wireframing > Sticky notes > Agreeing on structure and what goes on each page
  • Prototyping > Coding > Show you what's on each page > Allows you to show to client > Save time > a tool for buy-in
  • The more traditional workflow is : designing > developing > re-designing > re-developing. Prototyping allows you to do that
  • Hard to develop a plan : planning vs. making

Prototyping is the fastest way to validate an idea

Possible to use a static site generators e.g. metalsmith


  • Having conversations early -> if you know how drupal will spit out -> develop CSS file to structure
  • Psychological tool -> making them think they're in good hands -> first site looks good while not putting in too much work
  • Be intentional about the design and design a framework before you code half