Case study of a 2-week UX design Kickstarter workshop by Anudeep Ayyagari

Introduction

Hello everyone! I’m Nikhitha Madaka, a graduate in electrical and electronics engineering. My passion for design led me to join this workshop. Coming from a non-designing background, this workshop gave me a great introduction to UX design. The learning process was incredibly easy and convenient, explained using everyday examples. I’m excited to share my experience with you.

We had an engaging kickoff session on the first day that introduced us to the workshop. The session was fantastic and made learning the concepts really memorable. Here are the key takeaways:

1) Focus on being a practical expert rather than just holding a certificate.

2) The unique backward approach of the workshop made learning much better.

3) Remember, we’re not the users. We design products for them, especially considering large-scale production.

4) Understanding the root cause and all related aspects is crucial for creating effective solutions.

5) Prioritize problems based on constraints, budget, and impact on users. This approach is what sets us apart as valuable UX designers.

UI Basics — Learn by making a calculator UI

During the first task of creating a calculator screen, I got to try out Figma, a design tool. It was so easy for me as I already knew how to use Figma from before. It made the task quite smooth and enjoyable!

UX Basics — Learning from Existing Design

This task made me realize the importance of studying and drawing insights from existing product designs. I practiced generating common-sense questions and answers regarding both physical like ceiling fans, camera apps, water bottles.. etc. and digital products I use regularly, which was a great learning experience.

Introduction to UX design principles

1. Jakob’s law

Jakob’s law states that users spend most of their time on other sites. This means your users prefer your site to work the same way as all the other sites/apps they already know.

When different apps work in similar ways, and we can easily figure out what to do without explanations, it’s because we use the same easy-to-understand actions and signs. This makes using the apps straightforward and simple.

2. Fitt’s law

Fitt’s Law states that: The time to acquire a target is the function of the distance to and the size of the target.To enhance our understanding of the law, we were tasked with creating a music app screen design using Figma.

So, I understood that things that are closer and larger on the screen are easier to tap or interact with. When we use our phones, our thumbs do most of the tapping, so when elements on the screen are big and close to our thumbs, it’s easier to use them.

3. Hick’s Law: The time it takes to make a decision increases with the number and complexity of choices. The more choices you have, the longer it takes to decide.” When using YouTube, it’s easier to pick a video to watch because it shows you a few good options without overwhelming you with too many. It’s all about keeping things simple and easy to decide.

4. Doherty Threshold: Productivity soars when a computer and its user interact at a pace (<400ms) that ensures that neither has to wait on the other. When using a product, it’s important to know how long to wait for results. Waiting too long can lead to frustration and mistakes. Clear communication about expected timeframes is essential to keep users satisfied.

5. The Zeigarnik Effect gives an answer for why many apps show status bars. People remember uncompleted or interrupted tasks better than completed tasks.

Observing an unfinished task tends to encourage individuals to see it through to completion. People generally prefer things to be in a state of completion rather than being left unfinished.

Wireframing and Prototyping:

Low-fidelity Wireframes:

Creating low-fidelity wireframes involves sketching out rough, basic representations of a design or interface. These wireframes are simple, and quick, and don’t contain intricate details, allowing for rapid prototyping and concept exploration. It is also easy for the designers to make changes in this state. Similarly the feedbacks will be genuine since it is the starting stage.In this workshop I used marvel app to make a low fidelity prototype. This was so simple and fun to do.

High-fidelity Wireframes:

High-fidelity wireframing refers to the process of creating detailed and polished digital representations of a design or interface. These wireframes closely resemble the final product, incorporating precise elements, styles, and interactive features to provide a realistic and comprehensive view of the end result.

Heuristic evaluation

I have observed the heuristic evaluation principles from the completely existing product just by generating and answering to the common sense questions.

1. Flexibility and efficiency of use
2. Recognition rather than recall
3. Consistency and standards
4. Error prevention
5. User control and freedom
6. Help and documentation
7. visibility of system status
8. helping users recognize, diagnose, and recover from errors
9. aesthetic and minimalistic design
10. match between system and real world