Sarransh Agrawal

Senior UX Designer
About Me
I am a professional UX/UI Designer with over a year of experience in the field of web and mobile design. In my time as a designer, I have gained expertise in Figma and Adobe Creative Suite for creating stunning visuals for clients. I am passionate about researching user needs and creating user-centric designs that are both functional and aesthetically pleasing. I also keep up-to-date on industry trends and best practices to ensure my designs are modern and effective. As a UX/UI designer, I strive to use my creative skills to create digital experiences that make a positive impact on users’ lives.

Written Blogs

Sarransh Agrawal

UX Laws

1. Aesthetic-Usability Effect

Summary: Users are more likely to find visually attractive designs more usable, even if the actual functionality is unchanged. Good aesthetics can enhance the overall user experience by making users more tolerant of minor usability issues and more satisfied with the interaction.

Example: Apple’s clean and sleek product designs, which users find more enjoyable to interact with due to their high aesthetic appeal.

Actionable Advice:

- Enhance visual appeal through careful selection of colors, typography, and imagery.

- Ensure the design is aesthetically pleasing without compromising functionality.

- Conduct user testing to balance aesthetics and usability.

2. Doherty Threshold

Summary: When the interaction between user and system occurs within 400 milliseconds, users are more engaged, leading to higher productivity. Quick system responses keep the user's attention and provide a seamless experience.

Example: Instant search suggestions on Google, where results appear as the user types, keeping them engaged.

Actionable Advice:

- Optimize performance to ensure response times are within the 400ms threshold.

- Use asynchronous processing to handle large data sets without slowing down the user interface.

- Provide visual feedback during longer operations to maintain user engagement.

3. Fitts’s Law

Summary: The time required to move to a target area is a function of the distance to the target and the size of the target. Larger and closer targets can be selected faster and more accurately.

Example: Large touch targets on mobile apps make it easier for users to interact without precision errors.

Actionable Advice:

- Increase the size of important buttons and clickable areas.

- Place frequently used buttons closer to where users’ hands naturally rest.

- Ensure touch targets have ample spacing to avoid accidental clicks.

4. Goal-Gradient Effect

Summary: The closer users are to completing a goal, the more motivated they become to finish it. Showing progress towards a goal can enhance user motivation and engagement.

Example: Progress bars in online surveys or e-commerce checkout processes that show users how close they are to completion.

Actionable Advice:

- Use progress indicators to visually display advancement towards a goal.

- Break tasks into smaller, more manageable steps to maintain momentum.

- Provide rewards or positive feedback as users make progress.

5. Hick’s Law

Summary: The time it takes for a person to make a decision increases with the number and complexity of choices. Simplifying choices can help users make decisions faster and reduce cognitive load.

Example: Simplified menus on websites like Google, which reduce the number of options presented to the user at one time.

Actionable Advice:

- Limit the number of choices presented to the user.

- Group related options together to make decision-making easier.

- Use progressive disclosure to reveal information gradually, avoiding overwhelming the user.

6. Jakob’s Law

Summary: Users prefer your site to work the same way as all the other sites they already know. Familiar design patterns increase usability by leveraging users’ prior experiences.

Example: Similar navigation patterns across social media platforms like Facebook, Twitter, and LinkedIn, making it easy for users to navigate new sites.

Actionable Advice:

- Adhere to established design conventions and patterns that users are familiar with.

- Ensure consistency in navigation and layout to prevent confusion.

- Conduct usability testing to confirm that the design meets users' expectations.

7. Law of Common Region

Summary: Elements within the same region are perceived as grouped together. Using visual boundaries to group elements can improve the organization and clarity of the interface.

Example: Grouping of related products on e-commerce sites using borders and background colors.

Actionable Advice:

- Use borders, backgrounds, and visual boundaries to group related items.

- Ensure that items within the same region are related and logically grouped.

- Avoid overlapping regions to prevent confusion and maintain clarity.

8. Law of Proximity

Summary: Objects that are close to each other are perceived as related. Proximity can be used to organize information and create visual associations.

Example: Clustering of buttons in a toolbar to indicate they perform related functions.

Actionable Advice:

- Place related items close together to indicate their relationship.

- Use spacing to create visual groups and separate unrelated items.

- Ensure that the layout is clear and items are logically grouped.

9. Law of Prägnanz

Summary: People will perceive and interpret ambiguous or complex images as the simplest form(s) possible. Designs should be made simple and clear to facilitate user understanding.

Example: Simplified logos like Nike’s swoosh, which are easy to recognize and remember.

Actionable Advice:

- Design for clarity and simplicity, avoiding unnecessary complexity.

- Use clear and straightforward visuals to convey information.

- Test designs with users to ensure they are easily understood.

10. Law of Similarity

Summary: Items that look similar are perceived as part of the same group. Visual similarities can be used to create associations and improve the organization of the interface.

Example: Consistent styling of buttons across a website to indicate they perform similar functions.

Actionable Advice:

- Use similar colors, shapes, or sizes for related items to visually group them.

- Differentiate between dissimilar items to reduce confusion.

- Apply consistent styling for grouped elements to reinforce their relationship.

11. Law of Uniform Connectedness

Summary: Elements connected by uniform visual properties are perceived as being more related than elements not connected. Visual connections can be used to indicate relationships between elements.

Example: Connected form fields with a shared background to indicate they belong to the same form.

Actionable Advice:

- Use lines, colors, and shapes to connect related elements.

- Ensure connections are clear and not ambiguous.

- Use consistent visual connections to maintain clarity and organization.

12. Miller’s Law

Summary: People can hold about seven items in their working memory. Chunking information into smaller groups can help users process and remember it more effectively.

Example: Phone numbers broken into chunks (e.g., 123-456-7890) to make them easier to remember.

Actionable Advice:

- Break information into smaller chunks or groups.

- Limit the amount of information presented at once.

- Use short-term memory-friendly design patterns to facilitate processing and recall.

13. Occam’s Razor

Summary: Among competing hypotheses, the one with the fewest assumptions should be selected. Simplicity leads to better usability and fewer errors.

Example: Minimalist web design that eliminates unnecessary elements and focuses on core functionality.

Actionable Advice:

- Remove unnecessary complexity and focus on simplicity and clarity.

- Streamline user interactions to reduce cognitive load.

- Continuously evaluate and refine designs to ensure simplicity.

14. Paradox of the Active User

Summary: Users often prefer to start using a system immediately rather than spend time learning about it. Intuitive interfaces reduce the need for extensive training.

Example: Intuitive mobile app interfaces that allow users to perform tasks without needing a manual.

Actionable Advice:

- Make interfaces intuitive and self-explanatory to facilitate immediate use.

- Provide in-context help and tooltips to assist users as needed.

- Design for minimal training and maximize usability.

15. Pareto Principle

Summary: 80% of the effects come from 20% of the causes. Focusing on the most impactful elements can maximize user satisfaction and efficiency.

Example: Focusing on key features that users value most in a software application.

Actionable Advice:

- Focus on the most impactful elements of the design.

- Prioritize features that provide the greatest value to users.

- Continuously assess and refine based on user feedback to ensure focus on key areas.

16. Parkinson’s Law

Summary: Work expands to fill the time available for its completion. Setting clear deadlines can improve efficiency and productivity.

Example: Time-boxed project management to ensure tasks are completed within set time frames.

Actionable Advice:

- Set clear, concise deadlines to ensure tasks are completed efficiently.

- Manage time effectively to prevent work from expanding unnecessarily.

- Avoid unnecessary delays and inefficiencies by maintaining a focus on deadlines.

17. Peak-End Rule

Summary: People judge an experience based mainly on how they felt at its peak and its end. Designing for memorable moments can enhance overall satisfaction.

Example: Memorable check-out process in e-commerce that leaves a lasting positive impression.

Actionable Advice:

- Design key moments in the user experience to be particularly positive and memorable.

- Ensure a smooth, satisfying conclusion to interactions.

- Optimize for strong positive peaks and endings to enhance overall satisfaction.

18. Postel’s Law

Summary: Be conservative in what you do, be liberal in what you accept from others. Robust and flexible systems handle user input gracefully.

Example: Robust form validation that accepts various input formats and corrects errors.

Actionable Advice:

- Create robust and flexible systems that handle user input gracefully.

- Ensure systems are tolerant of different types of input to prevent errors.

- Maintain a focus on flexibility and robustness in design.

Sarransh Agrawal

Gamification in UX: Turning User Interaction into a Rewarding Experience

In today's digital age, user experience (UX) is paramount when it comes to designing websites and applications. One effective way to enhance UX is through gamification, which involves integrating game elements into non-gaming contexts to engage users and make their interactions more enjoyable.

Gamification in Edtech: My Experience

Let me start by sharing my personal experience of implementing gamification in an Edtech platform aimed at children aged 8-14 to learn coding. As an Edtech enthusiast, I recognized the importance of making learning a fun and interactive experience, especially for kids.

To achieve this, I introduced cool badges and anime-related levels inspired by popular themes among kids. These levels, such as Coding Apprentice, Coding Ronin, Coding Samurai, Coding Ninja, Coding Shogun, and Coding Sensei, not only added an element of excitement but also provided a clear sense of progression.

Accompanying these levels were badges like Azure, Jade Quick Learner, Scarlet Star, Radiant Imaginator, and Aurum Recognition badge, which children could earn for their achievements. These badges not only recognized their accomplishments but also served as tangible motivators, encouraging them to continue learning and improving their coding skills.

Furthermore, we implemented a point system-based leaderboard, allowing parents to track their children's performance and encouraging healthy competition. This not only motivated the kids to engage more actively with the platform but also fostered a sense of accomplishment and pride.

Gamification Beyond Edtech

Gamification is not limited to the Edtech sector; it can be applied to various domains to enhance UX. Here are a few examples:

1. E-commerce: E-commerce websites can introduce loyalty programs where customers earn points and rewards for making purchases. These rewards can include discounts, exclusive offers, or early access to sales events. By gamifying the shopping experience, businesses can increase customer engagement and retention.

2. Health and Fitness: Health and fitness apps can use gamification to motivate users to exercise regularly. They can offer achievements and badges for completing milestones, such as running a certain distance or reaching a specific fitness level. Users can compete with friends and track their progress, making the journey to better health more enjoyable and rewarding.

3. Social Media: Social media platforms often employ gamification techniques to boost user engagement. Features like "likes," comments, and shares serve as virtual rewards, encouraging users to interact with posts and stay connected with their networks.

The Impact of Gamification on User Engagement

The impact of gamification on user engagement is substantial. It fosters a sense of competition, achievement, and progress, which keeps users coming back for more. By making the user experience enjoyable and rewarding, gamification can increase user retention and drive user behavior in the desired direction.

Users are more likely to explore and interact with a platform when they know there are tangible rewards and recognition waiting for them. This not only benefits businesses and platforms by increasing user engagement but also creates a more satisfying and memorable experience for the users themselves.

In Conclusion

In conclusion, gamification is a powerful tool for enhancing user experience across various domains. My experience with implementing gamification in the Edtech platform for coding not only made learning enjoyable for kids but also led to increased engagement and better outcomes.

Whether it's in education, e-commerce, health and fitness, or any other field, gamification has the potential to transform user interactions into rewarding and memorable experiences. It's a strategy that not only benefits users but also the businesses and platforms that implement it, creating a win-win situation for all parties involved. So, if you're looking to improve UX and engage your audience, consider adding a touch of gamification to your strategy.

Sarransh Agrawal

Dangers of Minimalism: Exploring the Downsides of a Simplistic Design Approach

As an observer of design in my day-to-day life, I have noticed the pervasive influence of minimalism. Its simplistic and clean approach has permeated various aspects of our surroundings, from public spaces to digital interfaces. While minimalism can create visually pleasing environments, I have also become aware of the potential pitfalls that come with an overly simplistic design approach. In this blog post, I will share my perspective on the dangers I've observed, including how minimalism can take away the uniqueness of cities and make them all look similar. I will also explore how we can strike a balance between minimalism and intricate details in our designs.

Minimalism: A Closer Look

Minimalism, in its extreme form, can sometimes overlook important aspects of design. Let's delve into a few examples that highlight the dangers I've noticed:

Phone Booths:

Imagine walking past a phone booth that follows a minimalist design approach. It may have clean lines and a neutral color palette, but I couldn't help but notice the lack of privacy and soundproofing. Engaging in a phone conversation without privacy can be uncomfortable, and the absence of acoustic insulation may result in distractions. Incorporating thoughtful details such as frosted glass panels or noise-absorbing materials would strike a balance between simplicity and functionality.

Sarransh Agrawal

The Art of the Cluttered Website: Why Japanese Web Design is So Unique

Introduction

As a web design enthusiast, I have always been fascinated by the diversity of design aesthetics across different cultures and regions. One style that caught my attention is the unique and often perplexing cluttered user interface (UI) seen on many Japanese websites. While not all Japanese websites follow this design philosophy, there is indeed a notable trend towards packing more information and elements into a single page. In this blog, we'll explore the reasons behind this enigmatic cluttered UI in Japanese web design, highlighting cultural, linguistic, and technical factors that contribute to this phenomenon.

The Linguistic Challenge

One significant factor that influences Japanese web design is the complexity of the Japanese language itself. Unlike English, which primarily uses the Latin alphabet, Japanese employs three scripts: hiragana, katakana, and kanji. The presence of multiple characters and limited emphasis options, such as bold or italic, can make it challenging to create a visually balanced layout. Designers often resort to alternative methods like flashing colors or using other visual cues to make essential elements stand out. An excellent example of this linguistic challenge can be found on online shopping platforms where product descriptions and specifications demand meticulous display of information.

Embracing Cultural Aesthetics

Japanese culture is rich and diverse, and its influence is often reflected in web design. Japanese aesthetics often embrace intricate visuals, vibrant colors, and a harmonious balance between elements. While this artistic style might appeal to many, it can lead to a perceived sense of busyness for those accustomed to minimalist designs prevalent in other parts of the world. A website showcasing traditional Japanese arts or entertainment, such as Kabuki theater, might use elaborate graphics and a myriad of colors to capture the essence of the culture.


Prioritizing Functionality and Accessibility

Japanese web design places a strong emphasis on functionality and accessibility. Websites are often designed to cater to a broad range of users, providing them with as much information as possible. To achieve this, Japanese websites might incorporate numerous navigation menus, links, and content sections on a single page. This approach aims to offer quick access to information or services, especially for users who prefer comprehensive details upfront. A perfect illustration of this functional prioritization can be observed on government websites, such as the Japan National Tourism Organization (JNTO), which serves as a comprehensive resource hub for citizens, tourists, and businesses alike.

The Tech Revolution and Early Tech Adoption

Another intriguing aspect that shapes Japanese web design is the nation's early tech revolution. Japan experienced rapid technological advancements much earlier than many other parts of the world. This early exposure to technology and the internet might have influenced user behavior, as Japanese users got accustomed to websites that packed more information into a single screen. As a result, they developed a preference for content-dense UIs, which can be seen on various Japanese websites.

Bold and Cluttered Product Design  

The influence of cluttered UI extends beyond websites and permeates other aspects of Japanese design. Product packaging, especially in the manga and entertainment industry, often features bold and vivid designs with intricate details. Manga, a popular form of Japanese comic books, has characters and scenes densely packed on a single page, reflecting the cultural inclination towards information-rich visuals. This affinity for bold designs carries over to product packaging, where bright colors and busy layouts are used to catch the consumer's attention quickly.

Outdated Screen Layout Habits

While Japan is undoubtedly at the forefront of technology, some habits die hard. Japanese users, including the older generation, have grown accustomed to screen layouts that allow more information to fit on a single page. This preference can be attributed to past technological limitations and the early adoption of devices with smaller screens. Even as technology has advanced, and screen sizes have increased globally, some Japanese websites still maintain a content-dense UI, resulting in a cluttered appearance to those accustomed to more spacious designs.

Not All Japanese Websites Are Cluttered

While the cluttered UI has been a defining characteristic of many Japanese websites, it's essential to acknowledge that not all Japanese websites follow this trend. In recent years, there has been a shift towards more modern and minimalist web designs in Japan, influenced by global design trends and evolving user preferences. Websites of tech giants like Sony and Nintendo showcase sleek and streamlined interfaces, demonstrating that Japan is also embracing the elegance of simplicity in certain contexts.   

Conclusion

Japanese web design's cluttered UI is a captivating amalgamation of linguistic, cultural, technical, and historical factors. The nation's early tech revolution, cultural aesthetics, and a preference for content-dense layouts have contributed to the distinctive look of many Japanese websites. As we explore the dynamic landscape of web design, understanding these factors allows us to appreciate the ingenuity behind this unique style. Embracing the cluttered UI of Japanese websites opens our minds to a design philosophy deeply rooted in a rich cultural heritage and early tech adoption. Let's celebrate the diversity of web design and gain insights from different perspectives as we navigate the digital realm.

Sarransh Agrawal

Designing My Way Through ProDT: A Journey of Learning and Growth

My year at ProDT as a UX/UI designer has been an enriching and transformative experience that has propelled me forward both professionally and personally. Working alongside a dynamic team on a diverse range of projects has not only sharpened my design skills but also instilled in me greater confidence and well-roundedness as a designer.

Mastering the Art of Decks and Brochures

One of the most significant learning experiences at ProDT has been mastering the art of creating compelling decks and brochures. I've had the opportunity to work on numerous projects involving these materials, and what makes this experience truly special is that it extends beyond design. I've also delved into conducting research to ensure that these assets are effective and impactful. This holistic approach has given me a deeper understanding of the role that decks and brochures play in communicating complex ideas and driving business outcomes.

Harnessing the Power of Agile

ProDT's daily scrum and agile project management structure have been instrumental in streamlining our workflows and enhancing team collaboration. The structured approach has not only boosted productivity but also improved communication and adaptability to changing project requirements. This has enabled us to deliver results efficiently and effectively, meeting client expectations and exceeding goals.

Motivation and Inspiration in a Thriving Environment

ProDT's regular hangout calls and vibrant working environment have been a constant source of motivation and inspiration. These interactions have fostered connections with fellow team members, enabling us to share ideas, seek feedback, and learn from each other's experiences. This open and collaborative environment has not only enhanced my social skills but also expanded my professional network, opening doors to new opportunities and perspectives.

Personal Growth Beyond Design

Beyond professional development, this journey has stretched my personal limits and encouraged me to step outside my comfort zone. I've had the opportunity to work on projects that I might not have encountered elsewhere, pushing me to adapt and learn new skills along the way. This willingness to embrace challenges has boosted my self-confidence and instilled in me a greater openness to learning new things. Additionally, I've honed my time management and organizational skills, enabling me to handle multiple projects simultaneously and meet deadlines consistently.

Notable Projects: Lens Catalogue and EdTech

The journey began with my first client project, the Lens Catalogue. It was a challenging yet exciting opportunity, and with the guidance of my product owner, I successfully completed the project in record time. This experience not only boosted my confidence but also laid the foundation for what was to come.

The EdTech project was a turning point. It introduced me to the world of AI and its applications in design. I used AI to generate results, design a user-friendly interface, and enhance the overall user experience. Seeing the client's satisfaction with the final product was incredibly rewarding and motivated me to delve deeper into this field.

AI-enabled Travel Project and the Role of Mentorship

Currently, I'm working on an AI-enabled travel project, where Manas, my manager, has played a crucial role in my journey. His guidance, support, and unwavering belief in my potential have pushed me to explore and excel in this domain. His mentorship has been invaluable in my growth as a designer.

ProDT's Impact: A Nurturing Environment for Growth

My time with ProDT, guided by Sanjeev, Manas, and my colleagues, has been a transformative phase. It's within this supportive environment that I've honed my skills, learned new techniques, and evolved into a better designer. ProDT not only expanded my knowledge but also provided a nurturing space for personal and professional growth.

Conclusion: A Journey of Perseverance and Continuous Learning

My transformation journey has been a testament to the power of learning, mentorship, and perseverance. From my very first project to my aspirations of becoming a UX researcher, I'm grateful for the experiences, people, and opportunities that have paved the way for my career growth. This journey is far from over, and I'm excited to see where it will take me next.