Alexis Abakasanga

Day 29: The Art of Wireframes

Avoiding the particular, insisting on the general

Alexis Abakasanga's photo
Alexis Abakasanga
·

2 min read

Table of contents

Wireframes are the "rough map" that will eventually be used by graphics and interface designers to create preliminary and final page designs for a site. Classic rules of composition such as middle and corners, rules of thirds, glutenberg z, and reading gravity combine to govern how we approach information displays.

Adonis and Jeffrey are tasked with designing a landing page for a plant shop. Adonis researches similar sites, gathering inspiration and having a mood board to start coming up with ideas. Jeffrey is excited by the task and runs straight into UI design without prior research or sketches. Adonis outlines several iterations, he settles for a couple and creates a low-fidelity wireframe ahead of the meeting. Jeffrey has already completed the task and awaits review ahead of the meeting so the design can be approved, and he can kick back and watch the new Black Clover movie that just came out.

Jeffrey is in the meeting, and the stakeholders have many questions and suggestions for his creative direction. He reinvents the wheel and confuses them about where certain elements are on the webpage. Finally, he is instructed to revisit the designs and make changes. Adonis is currently in the meeting, and the stakeholders appreciate the effort with his low-fidelity wireframes. After a couple of back-and-forths, they settle on how the main landing page should look, and he gets to work on it.

Learnings

Adonis saved time and energy by following due process to ensure a smooth meeting and delivery of his task. Jeffrey did not let the task breathe and ended up suffocating himself. When I have a project or task at hand, I will follow due processes.

References

60daysUXchallengewireframesux design