About
As a part of Techniche’s Creative Core team, my job was to lead a team of four in designing the official Techniche mobile application (upto developer handoffs) for people attending the annual techno-management fest of IIT Guwahati. Due to COVID restrictions, we collaborated on the project online. Find the application on Google Play Store now!
Role & Skills
Team Lead, Interaction & Visual Design
What is Techniche about?
Techniche is the annual techno-management festival of IIT Guwahati. Organised by the students of IIT Guwahati, the fest aims to engage students from all over the country with events, workshops, campaigns and competitions - some of them include the Guwahati Half Marathon, Wake Up & Vote, and Technothlon.
It has over 10 modules, each with their own set of events, competitions and rulebooks.
The 4 day festival covers a large ground in the 700+ acre IIT Guwahati campus.
The information regarding all events is conveyed through various social media platforms.
Throughout the 4 days of the fest, there are multiple events occurring simultaneously.
Process
Comparative (SWOT) Analysis
Mood Indigo
IIT Bombay
Antaragni
IIT Kanpur
Thomso
IIT Roorkee
STRENGTHS
- In-depth gamified maps to traverse the location
- Well structured daywise schedule
- Upload stories/blogs section for participants and visitors
- Quick and easy navigation (3 click rule)
WEAKNESSES
- Need to sign in with personal details to use app
- Event information scattered across website and app and other media
- Inconsistent and outdated UI
- No update in case of changes in the event timings, location, etc
OPPORTUNITIES
- Provision for users to keep track of interested/registered events
- Notifying and reminding in case of changes in the event details
- Event suggestions based on past activity
- Collecting feedback from participants to improve events and the overall experience
THREATS
- Competitors trying to increase engagement by gamifying the app by adding collectibles, easter eggs, and other incentives
- Technical limitations
- Multitude of events and modules may confuse outsiders
User Survey
We conducted an online questionnaire to answer some specific questions we had in mind. This survey was targeted towards prior Techniche attendees and received 52 responses.
82.7%
Respondents have faced difficulties in navigating around the campus to find the venue of different activities
84.6%
Respondents have lost track of event timings and schedule
71.1%
Respondents were unaware of events happening at other locations in campus
User Personae
These were crafted to act as a frame of reference for further ideation.
Ritvi Choudhary
Visitor from Guwahati city, 19, Local college-goer
SCENARIO
Excited about attending a major fest in an esteemed college in her city with her friends. Looking forward to the pronites & games of the fest over the tech events.
GOALS
- Attend events
- Have a good time with friends
- Roam around in the IITG Campus and experience its beauty
FRUSTRATIONS
- Navigating in campus
- Not knowing which events are going on, and their locations
- No easily accessible help-desk for queries
Yash Hatyal
Visiting Participant, 21, Student at IIT Madras
SCENARIO
Programming enthusiast who flew to Guwahati as a participant in the final round of a coding competition.
GOALS
- Evaluate his own technical skills
- Meet other people with similar interests
- Learn what is new in tech and experience it firsthand
FRUSTRATIONS
- Delays/changes in events
- Ill-defined event rules
- Have to keep checking for event results
- Confusion related to accomodation
Saumya Mehta
IIT Guwahati student and hostel boarder, 20
SCENARIO
Tech enthusiast, exploring the fest in her own college. Spontaneous and willing to participate on the spot if something interests her.
GOALS
- Find and attend interesting tech seminars
- Check out various events
FRUSTRATIONS
- Loses track of event timings and schedule
- Misses events of interest due to clash in timings
Focus Group Study
A participatory session in the form of a focus group of 8 people was conducted which helped understand goals and frustrations of our target audience, the analysis of which helped generate valuable insights.
Difficulty in navigating around the campus and finding the venue
Unaware/uninformed of what is happening in other locations in campus
Do not have easy access to transport details - bus timings, E rickshaw numbers
Event details, timings, winners & other highlights are scattered across social media platforms - cumbersome to look for
Miss out info regarding changes in event status (timing/ delay/ venue) due to the nature of their delivery (or lack thereof)
Aren’t sure how to best utilize their time when their event isn’t ongoing, and often miss events of interest due to clash in events
Lose track of event timings and schedule
Do not know who to approach in case of queries/emergencies
Accomodation and housing is confusing and unorganised
Brainstorming
After identifying the major problems and requirements, we proceeded to brainstorm and look for optimal solutions to solve these problems efficiently in the form of apt features.
Prioritizing Requirements
A MoSCoW Analysis was conducted to to prioritize the importance of requirements and features for the application. Some features were categorised under “won’t have” due to the scope and technical considerations (after discussions with the developing team).
MUST HAVE
- Event schedule
- Event and registration details
- Rulebooks for events
- Campus map
- Bus timings
- Important contact details
- FAQs and Help
SHOULD HAVE
- Notifying user in case of event changes
- Event status visibility
- Provision to “save” event for future use
- Personalized calendar
- Searching and filtering within events
- Redirecting to more information on event topic
- Winners for each event
- Links to social media pages
COULD HAVE
- Light and dark mode
- Warn user in case of event overlap
- Photo filters and games
- Past events footage, promos, aftermovies
- Event suggestions based on past activity
- Event live-streaming
- Collecting feedback from participant
WON'T HAVE
- In-app chat
- “Add friend” feature
- Referral codes for benefits
- Newsfeed
- Accomodation allocation
Information Architecture
Low Fidelity Wireframes
Visual Language
UI Guidelines
Material Design, Google
Colours
Primary
Accent
Background & Icons
Typography
Heading
Poppins Bold
16 pt
Body Text, Tag
SF Pro Display Regular
12 and 14 pt
Button
SF Pro Display Medium
14 pt
NOTE: The colour contrast in the UI follows the WCAG AA guidelines for normal text, large text and graphic elements, as well as the WCAG AAA guidelines for large text. Any visibility issues might be due to the mockups & platform.
ALSO, shoutout and thanks to the rest of the team for the 3D assets used in the app!
The Techniche App
Helps attendees keep track of events, schedule their plans and navigate around the institute campus.
Dark & Light Modes
The app is available in both dark and light modes. The default mode in the dark mode as it is easier on the eyes, drains less battery, and best suits the visual style of the fest.
User Onboarding
When the user launches the product for the first time, he is welcomed with a brief onboarding flow which provides instructions and highlights key features of the application.
New User
Existing User
Homepage
The event card shows
- Tag with event status
- Event details
- Option to bookmark/like
The events on the page are categorized into:
- Ongoing Events
- Upcoming Events
- Suggested Events
- Concluded Events
Users can also search for events by name and filter events on the basis of status, category and price of registration.
Search & Filter
The Homepage comprises all events of the fest, and users can carry out tasks like finding more information, registering for events, etc here.
Why 'Add to Calendar' if the user can bookmark/save?
When a user registers for events, they automatically get added to their calendar. Some events do not need registration, and these events can be added to calendar manually. Bookmarks, on the other hand, save the event for later reference.
Individual Event Pages
Event Schedule
Dropdown offers 2 schedules - 'Event Schedule' and 'My Schedule'.
Event schedule shows a day-wise schedule, with an additional provision to filter by category & time.
User can simply add an events to 'My Schedule' by clicking on the “+” sign.
Error Prevention Pop-Ups
My Schedule
Dropdown enables user to access 'My Schedule'.
Day-wise personal schedule, with the option to switch between ‘list’ & ‘calendar’ view.
.png)
.png)
Campus Map
Zoom around, search for locations, and filter by event venue. The navigate icon starts navigation in Google Maps.
Locations can be searched for and filtered by event venue and other amenities. Bus stops, food stalls, hostels, washrooms and other amenities are also indicated.
Hamburger Menu
On opening the hamburger menu, users can access pages including My Events, Food & Entertainment, Sponsors & Partners, Directory, Bus Timings, The Team and FAQs.
Users can also toggle between light and dark modes, edit their profile, visit Techniche’s social media pages and sign out.
My Events
Bus Timings
Food & Entertainment
Directory
Notifications
The user’s device receives push notifications in several cases. All notifications can be accessed by tapping the bell icon.
Here are the cases for which a user will receive a notification:
- Event is starting now
- Event is starting in x hours
- Event is postponed until further notice
- Event is delayed by x hours
- Event has been cancelled
- Event venue has been changed
- Event results have been updated
.png)
Reflection & Takeaways
First time leading a team (remotely!): This was challenging at first, but once I got a hang of how my team members worked, I tried to make sure they were taking away some important learnings and relevant skills from the project. Having pre-scheduled regular meetings and appropriate work allocation was key to maintaining consistency.
Working within technical constraints: Communicating with the developing team (and other teams involved in the execution of the project) to understand the feasibility of ideas saved us a lot of time and helped us set constraints early on in the project.