Let me ask you a simple question. Do you use Facebook? Yes, we all do! But have you ever wondered what makes it so addictive? Or what makes sending texts, booking a cab on Uber, ordering food on Zomato, and buying that beautiful black dress on Myntra so easy for that matter? It’s the user interface of these apps that provides us with an effortless user experience.
But what exactly is UI/UX design?
User experience (UX) means how easily a user can accomplish a task. User experience design refers to the process of enriching users’ experience by enhancing the ease of use and interaction between user and product. It involves analysing what, when, where, how, and why someone uses a product and designing their interaction in an enjoyable and usable form. User interface (UI) is everything into an information device with which a person may interact. User interface design, in the simplest terms, is the design of user interface, that is the look and feel, presentation, and interactivity of a product. It defines how a product should look focusing on the ease of use.
People tend to get confused between UI and UX and use them interchangeably. Here are some simple examples to explain the difference between the two. Consider a door handle. Its outer appearance including the design, colour, shape, and material is the user interface. The ease of opening the door by that handle is user experience. No matter how nice the handle looks or what material it is made from, if it is too short to hold, jammed, or turns in the upward direction, it will provide a bad user experience. Now, consider Internshala’s Digital Marketing Training page. The appearance of this page – colour combination, words/phrases, and elements (image and form) – is the user interface. The usage of specific font sizes of words, selection of colours for the background, form, and signup button, semi-filled form, and orientation of elements to enhance the experience constitute user experience design. Had this information (no matter how beautifully presented) been cluttered and you had to struggle to find relevant options, it would have been a bad user experience.
The first step in setting out to become a designer is to talk the language of design. Here are some terms commonly used in the design process.
1. Wireframe – It is a visual representation of user interface. It is a sketch of each page of a product drawn to decide where different elements should be placed so as to keep the user flow smooth.
2. Mockups – Wireframes are similar to a blueprint or a floor plan while mockups provide visual details of a design like colour and typography.
3. Prototype – It is a demo version of the product containing its vital elements. This detailed presentation of the final product doesn’t have full functionality and is used for testing the feasibility and usability of designs.
4. Affordance – It defines how well the user can understand an object’s purpose from its design. For example – the girl sign on a public washroom’s door provides clear affordance that it is a restroom for girls.
5. Responsive design – Your product (app) could be viewed across a variety of devices; its functionality and/or significant information needs to remain the same irrespective of the device. Responsive design is an approach that ensures just that. In simpler words, it ensures that the interface of a product is similar when viewed on a mobile, tablet, or a PC.
Essential skills and how to learn them-
1. Keen observation skill – Develop a habit to observe everything around you. Right from the red stars on a white teacup to billboards on roads, everything is a design and has a purpose behind it. For instance, architects purposely design uncomfortable park benches so that people don’t sleep on it. Similarly, you have to merge purpose with your design. Also, examine various websites and apps. These observations will help you fine-tune your designs.
2. Empathy towards users – UX design is all about the needs and feelings of users. So, it is extremely significant for you to put yourself in the users’ shoes. By doing so, you will understand the issues faced by users closely and can work towards solving them effectively. Spend time with people – understand how they think, study their needs, and talk about the apps they don’t like. After all, an unhappy customer is your greatest source of learning.
To understand the importance of user empathy and research in a design, let’s get back to the Internshala Trainings page.
While designing the page, we had to resolve many constraints. After weeks of research, we came up with the idea of keeping the signup form as well as the description of the training along with the video on a single screen. This helps the user understand what she would learn during the training and reduces her effort for signing up. It’s said that forms should be designed for one’s mom, that is for people who are not tech savvy. Thus, we’ve provided a semi-filled form here (with expected input) which makes it extremely user-friendly.
3. Coding – Although programming is not mandatory for a UI/UX designer, employers expect designers to have a basic knowledge of HTML and CSS because it doesn’t limit them to the CMS they work on and helps them prototype their ideas. You can go for an online training or learn from the various tutorials available on YouTube. It is only a matter of learning the syntax. Once you’ve done that, code!
How to start your journey as a UI/UX designer?
1. Learn the principles of design – To visualize whether your design would look good, you need to learn UI/UX principles such as colour, balance, contrast, typography, clarity, and consistency. To understand the psychological aspects of design, research into your project, create a brief, and prototype your ideas.
2. Learn to sketch – You don’t have to go to an art school for this. Just learn the basics and have your hands used to drawing the ideas that come to your mind.
3. Master design tools – To give a structure to your ideas, you need to learn to use design tools. The go-to tools for designers are –
a. Photoshop – It allows you to create and enhance images, illustrations, 3D artworks, websites, banners, and whatnot.
b. Illustrator – It uses mathematical constructs to create vector graphics. These features of Illustrator allow you to create logos, images, typography, and illustrations.
c. Sketch – With the coolest features of Adobe tools, it allows you to export codes and presets, edit vectors, and mirror iOS.
d. Experience Design(XD) – With features so enhanced and exciting, XD is a dream come true for designers. It allows you to create everything from low fidelity wireframes to fully interactive prototypes.
4. Read a lot – Right books and comprehensive articles on various aspects of design and advancements in this field will help you gain newer perspectives and broaden your horizon. Apart from various articles on InVision, Medium, and Creative Bloq, you can go through these books every designer should read. You can also follow designers on Dribbble, The Best Designs, and Awwwards to understand different patterns and designs.
5. Work on dummy projects – Why? Because it will give you exposure, experience, and a catchy portfolio. The mantra is to design and redesign. Design banners, logos, and posters for every event – your college’s fest, fresher party, or the Diwali party at your home! You can also start with creating sitemaps and simple webpages for NGOs. You might have come across many websites and apps which do not provide a smooth user experience, work on their design to create the best possible experience.
6. Do an internship – What could be a better way to enter the realm of design than doing an internship! An internship will expose you to designing for customers. Working with experienced designers will trigger your thinking and help you gain newer perspectives towards your designs. Most importantly, you’ll find a mentor who will guide you to try new trends and ideas and help you progress on the right track.
You can also read Gaurav’s journey from Zomato to Google as a UX designer to understand how you can start your design journey from scratch and master the skill through a series of internships.
1. Google’s Material Design is a set of guidelines for designers.
2. You can take up online courses on UI/UX design on Lynda, Hack Design, and Coursera.
3. To design great things, you need to master the design tools. Here are some tutorials for –
a. Photoshop – Adobe Photoshop channel, Photoshop simplified by Howard Pinsky.
b. Illustrator – Get started with Illustrator, Adobe tutorials.
c. Sketch – Sketch for beginners, Learn to Sketch.
d. XD – Official Adobe tutorials, XD for newbies, tuts+.
For further insights, you can visit this ultimate guide to become a UX designer.
Now that you’ve learnt the basics, apply to these UI/UX design internships and give colour to your career.
Image credits – UX Blog, Google images.