Uniti — A Case Study

R. Kirán Khan
13 min readFeb 10, 2020

--

‘Let’s get connected’ —App for isolated students

Concept: Self-Negotiated (Individual)
Skills: Research, Branding, Wireframing, User Flows, User Testing Prototyping Duration: February — April 2019
Tools: Sketch, Overflow, Adobe XD, Zeplin
Honours: Finalist — Highly Commended by Creative ConScience UK

Uniti App is a project with the objective to reduce the impact of loneliness on the mental health of students.

The aim was to empathise with students and to understand their needs by doing online survey, personas and user journey maps.

The Uniti app allows students to get connected with others even before joining the university, to learn each-other beforehand.

Another design aim is a solution for isolated students to share their feelings anonymously with trained staff and peers without a feeling of being judged by others.

The Problem

According to research, over 9 million people (almost a 5th of the population) say they are “always or often feel lonely”, but almost two-thirds do not feel comfortable admitting it. (British Red Cross and Co-Op, 2016)

Loneliness can be defined as an individual’s personal, subjective sense of lacking desired affection and social interaction with other people. Loneliness is not the same as social isolation. Although it has a social aspect, loneliness also can be understood by an individual’s subjective emotional state. (Ageuk.org.uk, 2015)

Secondary Research

An online survey conducted by BBC Research found that loneliness affects young people ages 16 to 24 years the most. Another recent research by the Red Cross found that 32% of young people (between 16–24 years) in the UK reported that they had often or always felt lonely in the last two weeks. (Thersa.org, 2019)

Young people leaving home for the first time are likely to experience feelings of isolation or loneliness. While this is often temporary,it can become an issue of concern for some young people. (Knight et al. 2006; Gentleman 2009).

A recent report suggests that people who feel lonely suggest to have a better understanding and empathy for others who experience loneliness or unfairness.

The study also suggests that people who feel discriminated against are more likely to feel lonely, and the levels of loneliness are much higher “if people are made to feel that they are different in a negative way”.

Aims & Objectives

The project’s objective was to define a clear target audience, and the aim was to focus on international students. According to a published report, about 750.000 students each year come to the UK for their studies. (Impact of international students in the UK, 2018)

The primary aim of this project was to understand the experience and emotions of young, international students and reduce the impact of loneliness on the mental health of students.

The research intention is to examine how the solution can help the affected students and create a platform for individuals who are struggling with loneliness and anxiety, even before and after joining the university and moving from origin country to the UK.

During the primary research, the aim was to empathise with students and understand their needs and concerns by doing online survey, personas, empathy map, and a journey map.

Methodology

To achieve the objectives and the aim of this project, the methodology based on the dschool.stanford.edu design thinking was chosen. This methodology defines the following project phases: empathise, define, ideate, prototype, and test. The method is used to understand and analyse the target users’ behaviour and get insights into the context the user interacts.

Methodology Diagram (Adapted from Dschool)

Primary Research

Analysis and Research Phase

An online survey was conducted to gain an insight into students’ thinking, behaviour, and to understand the emotions. The majority of survey respondents were students from the University (in London), aged 18–24.

An informal interview was held, in which 2 participants (international students) were asked general questions and engaged in conversation about the journey from the origin country to the UK and the admission procedure.

Survey Result

The online survey results showed that 45% of students are originally
from Asia or East Asia. 36% came from Europe, and only 18% are from the UK. The respondents are mostly between 18 and 24 years of age, and 55% of them have Asian ethnicity; 27% are White.

Further questions helped me to understand the behaviour and interests of the target users. The result shows that most of them like to use social media apps — mostly YouTube, WhatsApp, and Instagram. 45% of respondents do not like joining any clubs or other activities in the university. The response to the question of whether they like to get connected with other students or not gave a result of 55% with ‘yes’ and 27% were not sure.

The question which gave an interesting result was that 64% of them agreed to ‘feel lonely’ most of the time, and 18% were not sure what to say. However, 36% agreed that they spend most of their time on their own (alone).

Project Process

Initial Mind-map

During the process of design, I created an initial mind map, which helped me to understand the thinking of the target users.

Context Mapping

During the early stages of the project, context mapping is a technique used to inspire and to build empathy. We need to collect feelings of users, rather than facts, and ambitions, rather than tasks. (Esser, 2018)

User Research

The user’s research is focused on analysing users’ personality traits and personality types. The study helped to understand what makes someone who they are. Every person has an idea of their own personality, and psychologists define personality as individual differences in the way people tend to think, feel and behave.

Three personalities were identified

Personas

In order to gain empathy with the users I am be designing for, the persona data was analysed through the initial user research and secondary and primary research. 3 personas (students) were identified and designed from scratch in Sketch App. Each persona has different goals, pain points and needs.

UX method of creating a persona is the core of the development process to define issues and convert them into solutions.

An Ambivert Personality
An Extrovert Personality

An Introvert Persona

Empathy is important in understanding users holistically. These personas are characterised by only a few key attributes derived from interviews or observation. The persona designed below clearly summarises the research data. The main elements are the goals, pain points and needs. However, understanding their preferred channels is an important element for this research.

An Introvert Personality

Empathy Map

The empathy map was created to gain a deeper insight into the student’s thinking, feelings, worries, and aspirations.

Empathy Map of an introvert persona

User Journey Map

This journey map represents a timeline of an introverted student’s actions and visualising the details of all of the touch-points she comes into contact with while attempting to achieve a goal, as well as the emotions she experienced during that journey. The journey starts in China when the student received her admission letter from the university, and the journey ends after she
attends her first class.

User Journey Map illustrating user’s experience designed in Sketch App

Competitor Analysis

The competitor analysis is collected from online research and bespoke UX method from the user research outcomes. Users’ reviews were obtained from the App store ratings.

Direct and indirect Competitor Analysis

Umii App

The Umii App is a social networking app for university students. The app connects “like-minded students via personality traits”, who can then meet at their university. However, the app only shows the matched of students from the same university and allows syncing a new match result after at least 48 hours.

User’s Feedback: “This is a great idea with a really good interface and will be even better when more people join and interact on the app!!”

Wisdo App

Wisdo app is a social networking app for anyone who has a unique story to share. Users can register and discuss their personal problems and sensitive issues. The Wisdo community aims to help others by sharing and discussing problems. However, the app is not moderated by any trained member, and bad advice provided to vulnerable people can harm them badly.

User’s Feedback: “Please steer clear of this app I wanted to try it thinking I could speak to people that might know the pain I am going through but it has made it worse. It is just an unmoderated forum where people write all sorts of horrible things. There was someone with an obscene name, considered offensive in most of the world.”

The Student Room

The Student Room (TSR) app is a forum-based website and an app for iOS and Android users which allows users to post in a thread. Although the app has a feature of sending instant messages, a live chat feature is missing. The app has a poor user interface, and searching a keyword does not work properly.

User’s Feedback: “I have found that trying to submit posts or finish editing posts the button becomes stuck and you have to switch apps to perform another action.

Design Development

User Flow Map

Flow charts are useful and simple ways of mapping out the possibilities that may involve an app’s full experience. The User Task flow shown below reflects the four aims of this project.

The first aim is to allow users to join groups before accepting the admission offer. The second aim is for verified students to get connected with their personality-matched peers. The third aim is access to the helpline with trained staff and supportive peers. The helpline feature also allows users to chat anonymously. The fourth aim is to implement ‘gamification’ — a reward technique to enhance user engagement with the app.

User Task Flow Map

Paper Wireframes

The most basic paper wireframes were designed for each screen. In a demonstration or usability test, the sketches are switched according to user actions. One of the advantages of a paper prototype is that I could create multiple versions without wasting time on digital tools.

Low-fidelity Wireframes

The initial low-fidelity wireframes were designed in Sketch. However, after some research and reading reviews by UX practitioners, I decided to switch to Adobe XD. According to reviews, Adobe XD has recently improved its stability and performance. Adobe XD has also recently added a new feature called ‘Auto-Animate’, which enables designers to easily create prototypes with animated transitions.

Low-Fidelity wireframes were designed and prototyped in Adobe XD. The app flow was designed in the Overflow.io application. I managed to design a prototype of low-fidelity, mid-fid wireframes and high-fidelity wireframes in Adobe XD.

Mid-fidelity Wireframes & Prototype

The user interface was further improved to make it more realistic, appealing, and functional. The interface was modified with some additional features, based on testing and experimenting.

Mid-fidelity Wireframes

Content Design ~ Style Guide

During the design process, I felt the most suitable colour scheme for this project is warm colours. These colours represent warm, trust, loyalty, peace, feelings of happiness and spirituality.

Brand Identity

The name of the app is combined from two keywords: University & Unity. There are four aims to represent the brand symbol of Uniti App:
Unity | Communication | Acceptance | Connection

Typography

High-fidelity Wireframes

High-fidelity Wireframes

UI Inspection in Zeplin

I took the opportunity to inspect my design elements in this great collaboration tool for UI designers and front end developers. It allows for uploading wireframes or visual designs from Sketch or Adobe XD to add to a project folder in Zeplin. The annotations are automatically added to the designs, such as size of elements, colours, margins, and CSS suggestions for certain elements, which is very helpful for an online repository.

Design Rationale

I followed the latest Material Design guidelines. The approach to design principles from Google Material Design is very minimalistic and focused on what makes Material Design unique as a universal design system.

Onboarding

These are the first set of screens, which give an introduction of the
app and provides users an understanding of how the app works.

Sign-up and verifying uni email ID screens. Touch ID screens for existing users. After signing up and verifying their university email ID, new users
will see this onboarding screen and an action button to proceed with the personality test, which will then provide the result of matched peers.

Personality Test and Match preferences
Welcome message followed by finding matched peers.
Explore and Trending Activities Feed
Invite Peers for Meet-up Activity ~ Let’s Study Invite
Connections ~ Find New and View Profiles
Helpline ~ Chat with trained Staff and Peers ~ Guidance for Mental Health
Account Settings ~ Edit Profile and manage meet-ups
The main deliverable in this project is the high-fidelity interactive prototype developed in Adobe XD.
The Uniti app contains 139 screens.

Prototype Video

Discussion and Formative Evaluation.

The Uniti app project focuses on the mental health and well-being of students. It has been a very challenging project that required many detailed decisions. The outcomes are researched and include an overview of the results which has been obtained from surveys, personas, empathy map and user journey maps.

Other factors considered include psychology, environmental pressures, demographic issues, and many other contributing factors. When looking at these issues objectively, it becomes clear why human mental health is impacted so negatively. It also becomes possible to understand and empathise with the reasons why international students struggle physically and emotionally while moving to a new place.

It has been a very challenging project to analyse all of the problems and to find a suitable solution. The literature review also has played an important role in this project.

The research conducted during the study provided invaluable insight. During the defined process, constructive feedback was also received from a UX professional, which gave an understanding of how knowing the target users in a deeper level can help to use psychology in design and to get users to engage in behaviours they actually consider.

The main contribution made in this particular project is the visual approach in presenting the user experience content. Throughout the development process, consistent visual elements were created to make sure UI elements are consistent throughout the app.

The content, UI elements, fonts, backgrounds, and colours are designed in consistency. The branding and style guide was followed by every design decision. User Interface elements that are commonly used and that are consistent and widely understood by users were considered for this project.

The design process of this project was an innovative solution with a user-friendly, minimal interface, in order to ensure broad appeal to the target users. The final prototype has been developed by refining multiple design solutions and then testing the app multiple times.

Throughout the process, many new technical skills were learned. It is extremely rewarding to know that a viable solution for the problems of the target users is discovered. However, I feel that, if I had more time and resources, I could have asked technical advice and also tested the usability of the prototype with potential users.

While informal interviews were concluded during the research phase — gathering more data as the “User diary” — have not been investigated due to time and resource constraints.

In the future, the design concept and these ideas can be applied to improve the user experience and also to develop the native app for iOS and Android platforms.

“Human-centred design is premised on empathy, on the idea that the people you’re designing for are your roadmap to innovative solutions. All you have to do is empathise, understand them, and bring them along with you in the design process.” – IDEO field guide to human-centred design, 2015

References

Fradera, A. (2014). Loneliness is a disease that changes the brain’s structure
and function. [online] Research Digest. Available at: https://digest.bps.org.
uk/2014/11/12/loneliness-is-a-disease-that-changes-the-brains-structure-andfunction/ [Accessed 5 Mar. 2019].

Hammond, C. (n.d.). BBC Radio 4 — The Anatomy of Loneliness — Who feels
lonely? The results of the world’s largest loneliness study. [online] BBC. Available at: https://www.bbc.co.uk/programmes/articles/2yzhfv4DvqVp5nZyxBD8G23/who-feels-lonely-the-results-of-the-world-s-largest-loneliness-study [Accessed 1 Mar. 2019].

Mind.org.uk. (n.d.). Loneliness | Mind, the mental health charity — help for mental health problems. [online] Available at: https://www.mind.org.uk/information-support/tips-for-everyday-living/loneliness/#.XLeHBKbTV0s [Accessed 6 Mar. 2019].

Pappas, S. (2017). Personality Traits & Personality Types: What is Personality?.[online] Live Science. Available at: https://www.livescience.com/41313-personality-traits.html [Accessed 2 Mar. 2019].

--

--