Sketching
I began with some rough sketches of the layout I wanted to achieve. I began by sketching the profile page first, then expanded to an explore, themes and prints menus. Throughout the process I re-shuffled many of the different elements until I was completely satisfied with how they looked, however, I avoided going into too many details at this stage. Any text elements were drawn out and represented as scribbles/lines. I aimed to keep a few details consistent on each page, for example, a top and bottom bar and a title at the top of each page.
Wireframing
Before I began to draw my wireframes, I looked up several videos on YouTube to get an impression of the process. One video I actively followed while wireframing my first page. By the end of this, I was able to work out how to wireframe the other pages without assistance.
The most difficult part of the process was arranging the main content/boxes so that they fitted together nicely, without having the spaces between them be too inconsistent. This problem was most apparent when wireframing the prints and themes section. Using a layout grid helped me work through this problem.
 |
| Wireframe layouts for Phones |
 |
| Wireframe layouts for Desktop |
Comments
Post a Comment