Back to Home

Redesigning the Website for a User-Centric

Experience by Enhancing Information Architecture

and User Interface for better Engagement

As part of my internship project, I collaborated with INGLU, an event management company, to attract potential customers to purchase event passes and offer internships to students across Delhi University.

ABOUT

INGLU

INGLU is a fast-growing global youth community and leading student startup based in New Delhi, India. Known for organizing various events across the University of Delhi and managing projects for over 200 colleges, INGLU empowers young individuals through engaging internship opportunities.

What I did as a UX Designer

and UX Research?

WHAT I DID

METHODOLOGIES

  • Heuristic Evaluation

  • Human Centered Research

  • User Research

  • Competitive Analysis

  • Card Sorting

  • Wireframing and Prototyping

  • A/B Testing

  • Usability testing

  • Iterative testing

  • Analytics and Performance monitoring

DURATION

2 MONTHS

TOOLS

FIGMA

What Impact

my Design made?

A follow-up survey involving 200 participants revealed the significant impact of the website redesign. The following metrics demonstrate the tangible impact of the website redesign on enhancing user engagement, satisfaction, and community involvement within the INGLU platform:

55%

Increase in
website engagement

70%

Reduction in Bounce
rates

45%

increased internship applications

MY DESIGN PROCESS

I decided to shake things up by testing early in the design process. This way, I gained a deeper understanding of my users right from the start.

1.

Test

  • Tested the previous design to better understand the problem

2.

Empathize

  • Problem Statement
  • Competitive Analysis

3.

Define

  • User Interviews & Surveys

4.

Ideate

  • User Personas
  • User Journeys
  • User Flows
  • Sitemap

5.

Prototype

  • Low fidelity
  • Mid-Fidelity
  • High-Fidelity Prototype

6.

Test

  • Usability Tests
  • A/B Preference Tests

What is the

Problem Statement?

Due to a lack of user-friendly UI and comprehensive information architecture, users struggle to find relevant information. This has led to an increased bounce rate, negatively impacting event attendance and reducing internship applications.

Home page

EVENT page

CAREER page

Who are the users

I'm designing for?

University Students

Students from the Delhi University and other colleges seeking social or professional exposure through INGLU's events.

EVENT ORGANIZERS

Individuals and organizations interested in collaborating with INGLU to host or participate in various events.

COMPANIES

Businesses looking to collaborate with INGLU for internships, event sponsorships, and professional development workshops.

How are my

Competitors doing?

To inform the redesign of the INGLU website, I conducted a competitive analysis focusing on key players in the event management and youth engagement space, including Blue Turtle Entertainments and Evana Events:

Check Blue Turtle Entertainment

Check Ivana Events

USER

INTERVIEWS

I decided to conduct user interviews to identify issues with the previous website and avoid repeating them, as well as to gain a deeper understanding of my user base.

Check Interview Script here!

PARTICIPANS

4

DURATION

45-60 MINUTES

MEDIUM

IN-PERSON

What I Found

Navigation
Usability
Aesthetics
Content
Journeys
Conclusion

Difficult to Navigate 🧭🕸️: Users struggled to find information due to unclear menus, poorly labeled links, and non-intuitive navigation.


Frequent Dead Ends ⛔🚧: Many users encountered dead ends or broken links, halting their progress and forcing them to start over.

Complex Menu System 🧩🧠: The complex menu system confused users, making it hard to understand section relationships.


Search Functionality 🔍🚫: No search function offered.

Outdated Design 🕰️📅: Users found the website design outdated and unappealing, lacking modern elements that made it feel less professional and trustworthy.


Poor Layout 🗂️🌀: The layout is cluttered and disorganized, making it hard for users to focus on the important content.

Unclear and Confusing 🤔🌀: Users found unclear and contradictory information on the website, with text color schemes hindering accessibility.


Lack of Essential Information 🎓🎫: Poor information architecture made finding information like event schedules, contact details, internships, and upcoming events difficult for users.

Frustrating Experiences 🤦‍♂️😡: Users experienced frustration, such as being asked to apply for internships without any information, event cards without sufficient details, etc.

Too many popups 🚫🛑: Pop-ups appear every time a user tries to click a link or perform an action.

Improvements should focus on navigation clarity, addressing dead ends and broken links, redesigning information architecture, adding a search function, updating the design for modern appeal, organizing layout better, ensuring information clarity, and reducing frustrating experiences like pop-ups.

Getting to know

the user better

USER

PERSONAS

USER

JOURNEYS

USER

Flows

Entering the

IDEATION Phase

INFORMATION

ARCHITECTURE

I used the card sorting method with 6 participants to design the information architecture and determine the website's flow

Deciding on the Closed Card Sort Method

This approach involved pre-defining 5 flexible categories and 22 cards based on the existing content and anticipated user needs.

Understanding Users' Organizational Biases

Using the closed card sort method with predefined categories, I gained insights into how users group information, revealing their organizational biases. This was crucial for creating an optimal layout for INGLU's sitemap by highlighting common groupings and logical flows.

Similarity Matrix and Optimal Layout

The most helpful guide came from plotting the results into a similarity matrix. This matrix displayed the frequency with which certain cards were grouped together by participants, revealing strong associations and natural categorizations.

SiteMAP

LOW FiDELITY

WIREFRAMES

Next, I used pen and paper to sketch out wireframes to quickly frame the main functionalities of the website without getting too absorbed in unnecessary details.

CHECK LOW-FIDELITY WIREFRAMES

Using my Low-fidelity wireframes, I tested it with 3 people and then made some changes in the mid fi

Check Interview Script here!

PARTICIPANS

3

DURATION

40-50 minutes

MEDIUM

IN-PERSON

MID-FiDELITY

WIREFRAMES

After developing low-fidelity wireframes, I created a mid-fidelity prototype to refine the design and test functionality. This polished version of the INGLU website enabled realistic user testing, iterative improvements, and collaborative discussions with stakeholders.

CHECK MID-FIDELITY PROTOTYPE

Entering the

TEST Phase

USABILITY

TESTING

To evaluate my designs, I conducted structured interviews with my mid-fidelity wireframes using a diverse group of six participants, gathering lots of feedback and insights.

Check Interview Script here!

PARTICIPANS

6

DURATION

45-60 MINUTES

MEDIUM

IN-PERSON

Sorting test

INSIGHTS

After user testing, I sorted feedback from different participants using different colors. This helped me group similar comments and find patterns.

What I got

from Testing

Collaboration Logos

Many users felt that viewing all collaboration logos at once was more effective than using a carousel.

Event Section

Users found the carousel format for the "Don't Miss Out" unappealing and preferred a static display.

Stall Setup Section

Users mistook 'Reserve a Spot' for ticket booking instead of stall setup.

Testimonials Section

Users liked viewing multiple reviews simultaneously rather than one big review at a time.

Internship Cards

Visitors were uncertain if selecting a card would reveal more information or redirect them to the application page.

Search Function

Users expressed a need for a search option to find internships more easily.

Internship Types

Users were unclear about the difference between "Internships at INGLU" and "Collaborative Internships."

Comprehensive Filter

Users wanted to filter internships by location, type, work mode, salary range, and duration.

Internship Listings

Users disliked the repetitive "Collaborative Internships" section under the internship details page and vice versa.

Event Cards

Users wanted more details about events directly on the event cards.

Event Categories

Users wanted categories to facilitate easier event discovery.

Login/ Register

To convince stakeholders, I asked users about the login/ register feature. Based on that, we removed it.

Entering the

ITERATION Phase

Home 1

Collaboration Logos: Users prefer seeing all collaboration logos at once over a carousel; a static display is more effective.


"Don't Miss Out" Event Section: Users prefer a static display. Therefore, I decided to show the top 3 happening events instead of listing all upcoming ones.

Home 2

Set Up a Stall: Labeling this section as 'Reserve a Spot' confused users, who thought it was for booking tickets instead of attracting street vendors.


Testimonial Section: Users prefer viewing multiple reviews at once rather than one at a time with a 'Next' button.

Career

Cards Clarification: Users were unsure if clicking on a card would show details or go to the application page. To resolve this, we added a 'View Details' link for direct navigation to the internship details.


Search Functionality: Users expressed the need for a search option to find internships more easily.


Differentiation of Internship Types: Users were unclear about the difference between "Internships at INGLU" and "Collaborative Internships." We made these sections visually distinct to help users differentiate between the two types of internships.

Internship Filter

Filter Options: To meet user demand, we added a comprehensive filter for internships by location, type, work mode, salary range, and duration.


Removal of Repetitive Section: Users found the 'Collaborative Internships' section confusing and repetitive, so we removed it to streamline the page and avoid redundancy.

Events

Detailed Event Cards: Users wanted more details about events directly on the event cards. We added event name, venue, time, and price within each card for quick reference.


Event Categories: To facilitate easier event discovery, we introduced event categories so that users can view events based on their interests.

General

Create Event: To facilitate collaboration with INGLU, a 'Create an Event' button was added at the bottom of main pages for easy access.


Login/ Register: After discussions with stakeholders, I convinced them to remove the redundant Login/Register page to streamline the user experience.

FINAL

DESIGN

CHECKHIGH-FIDELITY PROTOTYPE

Home and About

Careers

Events

What I learned

What Went Well
What Was Hard
What To Improve

Several aspects of the INGLU website redesign project excelled: thorough user research, collaborative teamwork, iterative design, and effective implementation of high-fidelity wireframes. These elements ensured continuous improvement and accurately reflected the design vision, leading to the project's success.

Balancing stakeholder expectations with user needs was challenging, requiring careful negotiation and communication. Coordinating with developers to translate design concepts into functional elements, despite technical constraints, was also difficult. Open communication and creative problem-solving were essential.

Enhancing communication and feedback among stakeholders, designers, and developers would improve collaboration. Early user testing would provide clearer insights. Streamlining project management would boost efficiency, and ongoing training would strengthen team skills and cohesion.

  • MORE PROJECTS MORE PROJECTS

Still Scrolling?
Say hello or keep up the friendly snooping 👀

...✨ Fueled by caffeine, late nights, and lots of music @ 2024