
Process: Design

Process >> Research >> The People >> Design
To me, personas are critical in the creation and functionality of websites, mobile applications, and anything with which humans have to interact. There is strength in numbers, and personas are the accumulation of all of the collected data, information from surveys, interviews, and the vision of the clients.
Prioritizing

Feature Prioritization

Had the developer place items in terms of difficulty and ease to give a better idea of what was feasible.

We had information from devs in terms of APIs and what could be done, so we were able to adjust ease and difficulty.

Must Have, Should Have, Can Have, Won't Have based on the necessity and ease of the features and time frame.

Had the developer place items in terms of difficulty and ease to give a better idea of what was feasible.
Using the personas and company goals, I want to decide on the features that are needed, if they are viable, and any further microinteractions to take into consideration.
I found it very useful to include the developers and stakeholders in the discussion and to try to merge the persona's needs with their input.
Design Studio

Sketching

Long hours sketching out and iterating on ideas as a team.

Taking a longer look at our design and working out the kinks.

After independently sketching, we came together to decide on the best layouts.

Long hours sketching out and iterating on ideas as a team.
Design studios are sessions of time where you and your team sketch out specific pages of the app/site that you're remaking, and trying to figure out the best layouts possible while keeping with the brand. After a few sessions, you come together and decide on the final* layout.
When working with a team, design studios are the best method to finding and creating great layouts.
Chances are if you forgot an aspect of the design, someone else remembered it, and you can spend the next.
*Nothing is really final until after testing.




Low-Fidelity
Sketch
Wireframing
Photoshop
Illustrator

Product Page wireframe for some low-fidelity testing.

Front page of the site, just a quick wireframe based off of the design studio wall sketch.

Another low-fidelity to give idea of space and layout for our high-fidelity prototype.

Product Page wireframe for some low-fidelity testing.
Creating low-fidelity wireframes based off of our design studio sketches is one of the quickest way to test out the UI within the site.
Iterations are much easier on low-fidelity, and the high-fidelity mock-ups can be built on top of them.