Taskly | iOS Task Management App

My UX Design Process

BRIEF

Taskly is a responsive web app that I designed as part of a 3-month UX Design course through CareerFoundry in Berlin, Germany. The primary objective of this project was to identify the pain points in the current marketplace for task management apps and softwares, and create a data-driven solution by applying UX methodologies.

CONCEPT

Taskly was designed with my peers in mind. I wanted to create a tool that would enable them to be productive and effective in their work, so they could get off their devices and get back into the real world.

One of my personal pain points and frustrations with the way technology has permeated our lives, is the prevailing notion that ‘Busy is better”. Through my own experiences and user research, I’ve found that a lot of young people today feel that the only way to get where you want is to be constantly working. The only way to achieve ‘success’ is to work yourself to the point of exhaustion.

This was my inspiration for the ethos with this project. With Taskly, I wanted to create a task management app that was simple, effective and enjoyable to use. Beyond that, I wanted to make something that could allow users to achieve a better work-life balance. To enable people to with the tools to organise their lives, make them feel GOOD about being productive, and let them back out into the real world so they can focus on the things that really matter in life.

My UX Design Process...

01. Competitor Analysis

To gain insight into the current landscape for digital task management softwares, we spent time researching many of the leading apps on the current market. Our primary objective here was to identify both the strengths and weaknesses of apps that we would be competing with, and use that information to improve with Taskly where others were failing.

We used SWOT profiles to analyse every aspect of the apps that we’d be lining up against. From aesthetic, to content, from core business strategies to UI/UX. We left no stone unturned and came away with several ideas as to how we could differentiate Taskly from our competitors.

02. User Surveys

Based on what we learned about our competitors, I targeted potential users to see what they liked and didn’t like about their current task keeping and organisational methods - both analog and digital. We formulated specific questions to try and gauge how our future users could use Taskly to their benefit.

We used the data collected from our user surveys to inform our initial design decisions and come up with a list of core MVP (Most Viable Product) features that we wanted to make the focus of our Taskly app

03. User Personas

To be able to truly empathise with our potential target audience, we created user personas to better understand the needs, wants, goals and frustrations of the people who would eventually be using our application.

I consolidated all of the insights and comments from our user surveys, and used the information we’d gathered from those tests to create personas that represented our key target audience. At various points throughout the design process, we referred back to our user personas to see if we were being consistent with our methodlogy, and to double check at multiple iterative phases, whether or not the decisions we were making about our design were congruent with the needs of our users.

04. User Task Model & Experience Map

To dive even deeper into the mindset of our users, I created a both a task model for the ‘Create a Project’ feature, as well as a Customer Experience Map. The goal behind this was to empathise even further with our potential users, by taking into account what they would be thinking, feeling and hoping to accomplish at every stage of use within Taskly. Ultimately, what this did was allow us to shape the user experience at every level and sub-level, to provide the best possible experience to suit their needs.

05. Taskly Sitemap

The next phase of our journey was to create the information architecture for Taskly. We had an idea of who our potential users would be, we knew what they wanted and we were confident in what we could offer them. Now, it was time for us to create a roadmap for that success by breaking down the navigational process of our app into clear, bite-size pieces.

Through this exercise, we were able to recognise when the user had to ‘go too far’, or click to many times to achieve their desired goal. By creating a sitemap and properly organising our information architecture, it allowed us to go into the design phase with a clear idea of how we wanted or app to flow.

06. Paper Prototyping

Using our information architecture as a foundation, I began ideating a variety of different patterns and ways that users could interact with Taskly.

While this was probably the most tedious step throughout our whole design process, it was a great learning experience and resulted in a lot of valuable insights. By conducting several rounds of paper prototyping for each of our core MVP features, we were able to create a very low-fidelity version of Taskly which we were then able to build on.

By conducting several usability tests with our paper models, we were able to see how people would actually use our app. At this stage in Taskly’s development, it was useful for us to put sheets of paper in front of our users, and detach them from the digital experience. That way, we were able to see if people could rely on our sketches and written communication alone to navigate Taskly’s features, rather than the UI and the intuition that comes when you have a digital product in your hands.

07. Wireframes

• Link to interactive prototype 

After conducting several rounds of user tests with our paper prototype, we finally had enough user data to start going digital. Using digital prototyping tools, I created wireframes for the Sign Up, Project Creation, Task Creation and Calendar Overview functions on mobile, tablet and desktop.

Adding intractability with InVision, I was able to create interactive prototypes that I was actually able test on users. By testing our users with interactive prototypes, we were able to see if the user flows we’d developed actually worked like we wanted them to.

08. Usability Testing

Based on the feedback we received from testing our interactive prototypes, we altered our designs and created what at that point would be our final designs for Taskly (more or less). We then submitted those designs to another two rounds of testing, conducting an A/B Test and Click Test using Usability Hub.

By conducting the A/B test, we were able to test two different potential dashboard designs on our audience and see which they preferred. Using the Click Test, we were able to gauge the clarity of our dashboard navigation, by assigning testers a specific task and seeing if they could cary it out by clicking the right spots.

09. Visual Design

At this point it was time to focus on more of the visual elements of our design. Through several exercises, we learned about the different important visual components that must be considered (typeface, color, UI elements etc.) and went about creating the visual strategy for our individual applications.

Below is the UI kit that I produced and used to create my visual design for Taskly.