Wireframes
“ First, solve the problem.
Then, write the code. ”
- John Johnson
Wireframe
a visual guide that represents the skeletal framework of a website
|
Layout/ Elements |
Design |
Interaction |
|
| Wireframe | |||
| Mockup | |||
| Prototype | |||
| Product |
Why?
Saves programming time
Makes collaboration easier
Keeps you sane and friendly
How?
myBalsamiq
Free to use for us through Open Source license
How much design?
No colors
No images
No fonts
Layout
Padding/margins
Relative sizes (h1 etc)
But it's sketchy.
Yes, it's supposed to focus on structure.
How about interactions?
It doesn't affect back end work, right?
Well perhaps
Questions
deck
By Caner Uguz
