1. Google

What I mean by Google is that we do not have to invent the wheel, we have to look out there and try to make things better. So working on the Meteor online store, I looked at Amazon, Best Buy, Apple and BBC as a reference for best practices.

2. Sketches

There is a very good video that I have embedded to explain how to create sketches. The video has been produced and presented by Adaptive Path a great UX company in San Francisco (USA), so let’s see the video.

3. Wireframes

Once you know what you need on paper, then you can prepare wireframes. I use for this Axure, without doubt one of the best tools for rapidly creating wireframes.

While creating wireframes these are my opinions:

• Start creating a story (user search a product, select product, checkout process)
• Create clickable wireframes
• Start wireframing core elements of the solution, do not create any “nice to have”
• Do not add colours or look & feel distractions
• When you finish, try to simplify the wireframe (cut it on a half)

A wireframe will look like this:

wireframes online store

4. Specifications

I know a wireframe is not a technical specification, but it will help developers to understand what is required and then visualise how they are going to develop the solution.

But there are projects like an online store, where we need integration with a Customer Relationship Management (CRM), Entrerpise Resource Planning (ERP) or Content Management System (CMS), so one (1) or max two (2) pages technical document is a good element to have in order to explain the technical details but not specifying how these will be developed.

The technical document must be written by developers for every single person involved in the project, but in the mean time everyone must understand what is written, even if they are not technicians.

Once we have specified the solution considering at the top of every single decision the Business and User goals, the next step is Design.