USER EXPERIENCE AND THE NEED FOR WIREFRAMES:
Architects can be good User experience designers! I know that, because I am one such architect trying my hand at this wonderful profession. Being an aspiring Visual Designer, I have been trying, testing and designing a lot of low and high fidelity wireframes lately. To the UXers out there, the term ‘wireframe’ is homeland. But for many of you, it may be alien.
So let us start with the basics and that is, What exactly is UX?
If you Google it, you’ll probably get a definition by the famous Nielsen Norman Group: “User experience” (UX) encompasses all aspects of the end-user’s interaction with the company, its services, and its products.
Does that clear the air?
In simple words, user experience is the process of making any product user friendly. User experience completely dedicates itself to satisfying the end user’s needs and wants by clearly understanding a user’s mental module via user testing, analytics and user research.
On the other hand, user interface design is the beautification of a product made for the users. It deals with the look, feel and aesthetics.
Let’s take a very relative example to understand this better. Being an architect, I would take one that is most relative to me.
Say, a person wants to design a house. What you would first start with is the documentation of the pros and cons of the land on which this house would be built, the typology of land as well as the climate of that area.
Furthermore, you would jot down the requirements of your consumers, their needs-wants and the type of house that they are looking for. Once that is settled, you would move ahead and start with a conceptual or sketch design, correcting and redoing them with prior inputs from the user. You would then have the plans of the house ready for construction’s disposal.
This entire process of researching, documenting and conceptualizing can be called as a User Experience design. You’re designing the best of experience that the user could get while living in that house.
After that is done, we move on to the beautification of the plans, producing 3D visual models and renders for our clients/users to visualise the end product. We fill them in with the littlest of details, right from the material to the furniture design.
This can be called as an interface design. Enhancing the look, feel and aesthetics of the house.
This entire process of working excessively on bringing out the best of experience and design is known as an iterative process. User experience and user interface together comprise of a user centric design.
In the above example, we talked about sketching and conceptualizing. In the UX language, this activity is known as wireframing.
Wireframes are categorized into two:
Low and High Fidelity wireframes.
In simple language, a low fidelity wireframe is a sketched layout of the screen of your app, with basic placements of the contents of your screen. It is a step that combines the usage of content, task flow and information architecture. It is called a low fidelity wireframe as it is done with nothing but a paper and pencil and is easily disposable to occupy more plausible alternatives.
A high fidelity wireframe is the step you take after you are done sketching. Transforming that sketch into a properly measured and laid out design of every app screen. This step requires the use of a wireframing tool such as Axure, UX pin, Figma, Sketch and so on. This step leans more towards a final product and at this stage the front end developers generally take the wireframes and code it out. Wireframes are a great way to get all the team together on one page. When people start thinking alike, the final output is much more efficient.
The wireframes form a base for your prospective design output and hence are the most important step of UX and UI design.