0
!
Design Process
the
EXPLORING
Energetic
Adventurous
Stacy
Kvernmo
!
@funstacy
!
WebDevStudios
Smashing Magazine has a great comparison
http://bit.ly/RidLcM
A Few Responsive Web Design Tools
Adobe Edge Reflow CC
http://macaw.co/
+ many more
!
Communication
invisionapp.com
?
design
in the
browser
Let’s change the phrase
“designing in the browser”
to “deciding in the browser”
- Dan Moll
clients
need
visuals
mood boards!
styletil.es!
style prototypes!
interactivestyletiles.com
element collages
atomic design
Workflow
Sketch?
Prototype
in HTML
with real
content
LIES!
Design
Iterate
Style
Guides
Salesforce
FontShop
Mailchimp
Vox Media
Lonely Planet
demo.patternlab.com
Pears
stylifyme.com
Style Guide
Creators
Stacy +
Photoshop
Friends
Forever
Resources
Design Deliverable Process Methods
styletil.es
github.com/sparkbox/style-prototype
republicofquality.com/style-t...
Want to learn more?
stuffandnonsense.co.uk/blog/about/
time_to_stop_showing_clients_static_design_visuals
typecast.com/sem...
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Exploring the Design Process
Upcoming SlideShare
Loading in...5
×

Exploring the Design Process

742

Published on

With the popularity of responsive design, it seems like the process and tools that have been used in the past are certainly not ideal for the present. So what is the best solution?

Lets explore the available options and discuss how we communicate with our client as well as our developers in this ever changing world of web design.

Published in: Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
742
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Exploring the Design Process"

  1. 1. ! Design Process the EXPLORING Energetic Adventurous
  2. 2. Stacy Kvernmo ! @funstacy ! WebDevStudios
  3. 3. Smashing Magazine has a great comparison http://bit.ly/RidLcM A Few Responsive Web Design Tools
  4. 4. Adobe Edge Reflow CC
  5. 5. http://macaw.co/
  6. 6. + many more
  7. 7. ! Communication
  8. 8. invisionapp.com
  9. 9. ? design in the browser
  10. 10. Let’s change the phrase “designing in the browser” to “deciding in the browser” - Dan Moll
  11. 11. clients need visuals mood boards! styletil.es! style prototypes! interactivestyletiles.com element collages atomic design
  12. 12. Workflow
  13. 13. Sketch?
  14. 14. Prototype in HTML with real content LIES!
  15. 15. Design
  16. 16. Iterate
  17. 17. Style Guides Salesforce FontShop Mailchimp Vox Media Lonely Planet
  18. 18. demo.patternlab.com
  19. 19. Pears
  20. 20. stylifyme.com Style Guide Creators
  21. 21. Stacy + Photoshop Friends Forever
  22. 22. Resources Design Deliverable Process Methods styletil.es github.com/sparkbox/style-prototype republicofquality.com/style-tiles danielmall.com/articles/rif-element-collages bradfrostweb.com/blog/post/atomic-web-design ! Creating or maintaining style guides patternlab.io stylifyme.com pea.rs alistapart.com/article/creating-style-guides Responsive Mock Up Tools creative.adobe.com/products/reflow macaw.co froont.com ! Photoshop Documentation basecamp.com invisionapp.com
  23. 23. Want to learn more? stuffandnonsense.co.uk/blog/about/ time_to_stop_showing_clients_static_design_visuals typecast.com/seminars/post-comp danielmall.com/articles/visual-inventory rif.superfriend.ly/designs/round2 product.voxmedia.com/2013/1/24/5426808/an-inside-peek-into-the-polygon- design-process
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×