How to design a wireframe logically?

Question

I'd like to know what is the reasoning you go through when you wireframe a page.

After having determined the different components of a page, I usually identify the primary/secondary contents and key tasks (based on user stories, competitors review...). I then try to highlight content considered as primary or place it at the top of the page.

From your viewpoint, what's the logic behind wireframing?

Answer 1

1. low-fid wireframe allows UX designer to create mockups fast and discard bad ideas
2. Display how the elements on the page will interact together
3. Communicate functionality, hierarchy, content and other non graphic elements.
4. Getting people to agree on website/app structure before starting any graphic work
5. User testing and client presentations without getting distracted by colour, type and copy
6. Demonstrate user interactions
7. Navigation elements

Answer 2

• Domain finding
• Evaluation of existing product
• Finding your niche
• Wireframing
• ...

Wireframing stage comes after you have finalized your product domain and the selling point/uniqueness of the product. You then work on conveying how your uniqueness is better than the existing things by using design as your tool. Wireframes are used to rapidly sketch out the rough designs to visually see how the organization/navigation might look and feel like.

Wireframes are a quick and easy mean of prototyping. The main goals in your head while making wireframes should be:

• Feel : What might it look like?
• Implementation : What might it work like?
• Role : What might the experience be like?

Regarding the placement of things in your wireframes. Since, you have a good idea of who your target user is and what the purpose of the product is, your should be in a good position to find engagement hooks. The hook can be a call to action button near the top which attracts user attention or a video/image which does the same. The point of the hook is to drive the user to delve a bit further on your product with the expectation that you have a good enough product that if the user was explained properly, he would use it.

For other things, you should follow a similar approach and do some formal/informal user testing/client testing to see what placement they liked. Give them different options of layout, 3 different ideas is always good. The advantage of going in with multiple designs is, most of the time you will end up with a hybrid of the 3 with all the good points of them.