Studbud

Students Are Busy

It’s tough to be organised and productive. To be on top of everything all the time often overwhelms the best of us. Students who lead increasingly busy lives seem to be among the most stressed, and unfortunately the most disorganised. As a university project, I was tasked with creating a web app with predetermined functionality that would aim to improve the organisation and productivity of students.

The Process

This was a 14-week design project. The designing phase lasted 9-10 weeks before the final designs were developed into a functional web app. The user-centred design process was helpful in first empathising with my target user before making any important decision decisions. The design process followed ultimately diverged with research in the beginning, before converging on a target user and the needs of that user. After establishing a clear picture of the user, my process diverged again into thinking about the best ways of implementing the features we were allocated and ensuring the features were able to be coded in the remaining weeks.

Who Is Productive?

The task of improving the productivity and organisation of students is no easy feat. As with any design project, the problem must be further defined and targeted towards an unambiguous user. And so, the process of research began. I first conducted surveys among students aged 14-21 to gain a broad perspective on the issue and attempt to identify any patterns of behaviour. Questions were aimed at identifying basic information about the participants’ study and relaxation habits, and then comparing this with their productivity and organisational abilities.

I found that:

• Males were substantially less likely to start an assignment more than 14 days before the due date (less organised)

• Both males and females who studied less than 12 hours a week were likely to be less organized and less productive EVEN in those 12 hours.

• Those who were still in school were rated as slightly more productive than those at university.

This narrowed my user down to a male university student who studies less than 12 hours a week.

The Doing Is key

After conducting interviews, there were several key insights that seemed to emerge about the study habits of university students. The most prevalent were

•       most students are motivated to study by their peers and a desire to not fall behind other students or the content being taught.

•       Some students need a certain level of stress and reminders to stay organised, while others feel It only causes them more anxiety.

•       People can feel stressed even while they are studying. However, if they feel they are being productive – this often counters the stress.

• I don't want to fall behind or feel lost in next week’s class- Elijah

• I Wouldn't want an app in my face constantly reminding me of things. I think it would stress me out more- Matt

• I’m normally a bit stressed when studying but I feel relieved afterwards when I realise I have been kind of productive- Mia

What Works Now?

Online ethnography was conducted across both Apple and Android platforms on several productivity apps, including:

• Flat Tomato

• Flipd

• Focus to-do

This competitive analysis was useful in two ways. Firstly, it enabled me to understand the design patterns of similar apps, and the established conventions of certain features such as timers and checklists. Moreover, it served as a reconnaissance of the pain points for other users, and the difficulties many of them had with existing applications.

“it lacks the ability to sort to-dos yourself, making it difficult to create them in batches” -Brice 

“Can’t manually reset the count of pomodoros you have done for the day without reinstalling” –Wicked1888

“improve the UI and UX design, so that it’s visually simpler for users to navigate” -Jjjzzzzxz

Who Is This For?

Design is personal. How old is my user? What do they really need? What frustrates them about the status quo? Why are they using my app? To empathise with the user, the designer has to envision people as the complex characters we are, full of imperfections and idiosyncrasies. The personas I created were male-dominated, and based on students who study less than 12 hours a week. Their motivations, needs and frustrations are a reflection of the extensive research I have conducted. For example, Sarah’s motivations for using the app is based on Mia and Elijah’s reference for an ultimate need for a way to “manage due dates”

Sitemap

It should be mentioned that the given design brief constrained the functional features of the webapp to include the ones present in my app. Nevertheless, I created a sitemap detailing the hierarchy of pages and their relation to one another in the web app.

Sketches

Three initial sketches of the landing page for Studbud were drawn. Number 3 was discounted, given it is a little too much information for the user. This is supported by the key finding from online ethnography that “Some aspects of productivity apps can be unintuitive and too complex to use”. Number 1 was discounted given for many users like the persona Improving Ivan, efficient and quick access to features are of high importance. This quick access is not offered by sketch 1.

Therefore sketch 2 was chosen as the homepage.

Sketches to Wireframes

Now that I had become acquainted with the user, I began to design. The desktop and mobile sketches were designed with the main intention of being “simple and intuitive”. Interviews revealed that users wanted to be “constantly reminded” of their tasks but didn’t want “added stress”. Therefore the tasks are displayed on the home page without their due dates, and an optional pop-out menu was added.

So, the iterative process of designing continues:

• The task list was redesigned to be able to drag, drop and move tasks (often mentioned in reviews of productivity apps)

• The action of adding new tasks was made more natural by the greyed-out typing prompt (an often-implemented design pattern.

• The completion bar of the Pomodoro timer was adjusted to include milestones to make it more intuitive to use.

• Minor aesthetic adjustments were made to the acronym list

Wireframes

StudBud

Before I began to create my mock-ups, I mapped out a basic style guide as a reference to ensure consistency in my design. My design was kept simple with clean San serif fonts, minimalistic layouts, and a mute colour scheme. StudBud being a tool for productivity and organisation meant that distracting/ complex UIs should be avoided. Everything should be clear and operable but also breathable. This design aims to embody these values. Mock-ups for mobile devices were also introduced at this step.

Next Steps…

Now it has to work. The project had taken shape and the goal had now been clearly envisioned. But breathing life into the product was probably the most challenging part of this project. Spec lists and roadmaps of the necessary coding challenges that would have to be gradually conquered were drawn up. Following this planning, using HTML, CSS & JS, these designs were turned into a functioning website, based on the mockup designs above.