ANANT UNIVERSITY WEBSITE

Designing a website for a Design Institute

Research | UX Interviews | UX Design | Prototype | Test

The Challenge

AnantU, India’s first design university wanted to revamp its existing website for young design aspirants. The idea of this redesign was to help students discover information readily and at the same time come across as a highly competent university on par or even better than their competitors. They wanted the website to exude energetic, engaging, and interactive vibes yet be simple and intuitive.

My Role

I lead a team of 2 people on this project. My role was was not only to guide the team but to also create concepts for key flows and journeys. The most challenging part of the project was to simplify the tedious process and make the experience better for a user.

Project Duration: 7 months

🔨 Tools Used: Figma, Whimsical

📲 Platform: Adaptive

Process

Product Definition

A little about ANU

Anant National University, located in a lush green campus in Ahmedabad, is India’s first Design University. Established in 2016, AnantU is a brainchild of Ajay Piramal and is committed to nurturing Solutionaries, people who are revolutionary in their thinking, but solution-oriented in their approach.

Stakeholder Interviews

Multiple Conversations with the key people of the ANU team gave a lot of helpful:

  • There is significantly higher traffic on the website during the admission period

  • The college is comparatively new in the domain and is not known to prospective students hence the website has to play a major role in communicating the brand image and positioning.

Problem Statement

How might we inform, educate young aspirants about Anant University. Help them choose Anant University and make them feel great about their choice. Establish ourselves as a trusted institution which provides high quality education

 

Research

Competitor Analysis

We did a competitive analysis to understand what other institutes are doing in terms of the user experience, application process, course offerings, communication, UI, etc.


We discovered that almost all the competitors have a dated look and feel, non-intuitive affordances, and lots of unnecessary steps. The courses are not stated upfront, the information shown on the listing pages are inadequate and non-persuasive. None of the websites live up to their expertise in design. Their USP is their name and the weightage it brings along with it. Their information architecture is not well structured and confusing. And since an up and coming university would naturally look up and emulate these stalwarts, we had a LOT of work to do.

 

Understanding the user

We initially assumed that OTT would be the most preferred entertainment platform nowadays but we learned that the main target audience for Dish TV is semi-urban /rural, users who aren’t as heavily touched by platforms like Netflix, Amazon Prime yet. The website is majorly accessed via mobile.

Age group of visitors

What devices people use?

User Interviews & observations

The purpose of this exercise was to understand the reasons as to why students opt for / consider colleges for higher education. We spoke to both sets of students - potential candidates as well as current students to understand their mindsets and concerns while selecting colleges. Through our discussions we found out that students are most interested in knowing about the courses offered, flexible curriculum, placement statistics, faculty, campus location / infrastructure & the fees structure.

Heuristic Evaluation

Key shortcomings of the existing website

  • Unclear & un-intuitive navigation and too many menu items to choose from

  • Lacks professional UI look
- It doesn’t look or feel like the website is a representative of a design university

  • The information is patchy and unappealing

  • Considering it’s a new college the homepage lacks the invitation a potential user would expect

  • The strengths of the university aren’t being given enough prominence

  • The brand identity is getting lost amidst all the unnecessary noise

Analysis

Creating user personas 

During our interactions with users and potential users we found out that we had three broad categories of users that Anant U will be catering to. The first is the studious and the responsible kind who knows what they’re looking for and how to go about achieving their goals. The second is the oh no its too last minute kind who make things up as they go along and only do well when a deadline shows up at their door. The third is the mature kind who have tried things and not satisfied with where they are. They are the true millenials who want to help the world in any possible way. Based on Anant U’s programmes and our user groups we created three personas to empathize with.

Persona 1.png

Key findings

  • Most users since they’re young and glued to their smartphones visit websites from their mobile

  • There’s a lot of traffic on the website during admission season

  • Potential users had difficulty in trusting the university since they hadn’t heard of it

  • The website although rich in information is not easy to consume due to its tedious presentation

  • Users were immediately put off by the ‘ppt look’ on the homepage

  • Users had difficulty understanding what the website was offering even after scrolling all the way down to the footer

 

SORTING THE INFORMATION

Sorting the information in hand

Information Architecture

While working on the IA we faced a bunch of hurdles and had to ask a bunch of potential users to help us out with it. We ran 2 versions of card sort. Both open and closed to arrive at an information architecture that won by user consensus. We’d asked the users to think out loud while they were grouping menu items and their thoughts gave us other hidden insights that we weren’t expecting to find. We cut down the menu items from 9 to 7 main menu items. When we say cut down, we mean regroup and assign a hierarchy in terms of their importance and placement of the menu items on the website. We removed unnecessary sticky menus and gave them a more contextual and respectable position as they deserved. User interactions always helped us navigate our way to better navigation.

IA.png

Design

Initial Sketches

 

High fidelity wireframes

Wireframing

The most exciting part about the redesign is the freedom that client entrusted us with in regards to the language, content, colors and the structure. Creative hurdles from the client were almost close to none. This gave us the courage to take our creative confidence to the next level.




 

Redesigning the programs page

The second most important module was creating the programmes pages as the user would be looking to gather all the information available.

  • We started off with an overview page as it was essential to let the users know the extent of the programmes offered

  • We also wanted to highlight Anant University’s unique pedagogy which encouraged overall development of students with special emphasis on holistic learning

  • We closed off the page with student testimonials as it always helps to have social proof to enhance the credibility of the University

Program detail pages were full of important information like

  • Who the program is for,

  • What are the perks of joining the program,

  • What kind of courses will be covered,

  • How the credit system is structured,

  • The kind of spaces (workshops, studios, etc.) & tools the students will be exposed to some prominent faculty members

  • And lastly some student work to give the prospects a glimpse of what their peers have been upto.

PA1.png

Redesigning the campus page

One of the most exciting pages from a student’s perspective, we had to play it up as this was going to be their life for the next 4-5 years to come.

  • We started off with the spaces and infrastructure to show the width and depth of Anant U

  • An interactive section on student clubs really brings out the fun and playful nature of student clubs

  • We also featured Anant U’s wellness wing ‘Bloom’ by showcasing its benefits to give students and parents an assurance that student’s mental well being will also be taken care of

  • We also hyped Anant U events along with life in Ahmedabad to persuade the prospects to choose AnantU

  • Finally we closed off the page with campus cam (Anant U’s instagram feed) to support all the claims made by the campus page

Testing

Test. Evaluate. Repeat.


We out the website through multiple rounds of user testing to understand how they perceive it when it comes to trust and credibility, first impressions they had, were the users able to find the information they were looking for and how long it took them. On the basis of these findings, we tweaked and refined our designs to arrive at a successful website.

The final homepage

Let's break it down for better understanding

Simplified navigation with only the most important menu items

Video of campus life to showcase a glimpse life at ANU

Top reasons to choose ANU to build trust, credibility & excitement.

Interactive section which helps students to decide which course to pick.

Interesting section with some ANU facts & gallery to add more life to the page

One stop widget which informs the user about everything that's happening at ANU.

 

Key desktop screens

Key mobile screens

Mockup-mobile 1.png
 

Final outcome

Once again, we successfully created and delivered a user experience which was functional and delightful. The vibrant and energetic look and feel along with well structured (user specific)content and navigation helped us create a solution which catered to both business and user needs. What makes an academic experience memorable and worthwhile are its people and spaces and we maximized on those to bring out the new, free, flexible and modern Anant U flavour through our redesign.

This case study is just a highlight of the project which included 200+ screens only at UX level. 

Next Project

next project anu.png

Anant University - Website