Plantr-mockup-2-1.png

Planrt | Smart & Thoughtful Planner

Product Design

The Story

Time has become one of the major issues of each individual nowadays, and we have been fighting so long to control. In fact, through past decade, technology and digital world have done so much to defeat time and make our life more efficient.

I started my project with this question:

What is our perception of time in era of technology?
Observing Users

To start, I chose a time related activity to observe people do their day to day tasks. “Scheduling a meeting or creating an event” was the activity. From my observation, most of users schedule their event via Google Calendar, Hotmail or Apple calendar. Surprisingly, there was person form new generation who still use a notebook with a calendar, and when I asked her why don’t you use a digital version, she answered me, “ The notebook is more tangible and I don’t want to be too attached to my phone”.

What I’ve observed from other users was that the process of making an event seemed to be easy , however the planning and getting prepared for the created events were stressful and complicated. Some mentioned that they’re burdened by a lot of reminders from their personal and work events and reminders.

The Idea

I was looking for a solution to create more humane interaction with users, and empathize with them when it’s needed. I thought we can turn time management and scheduling into more meaningful and personalized experience. I How can we make a simple dentist appointment or an upcoming job interview less stressful and more joyful.

How a calendar/planner can emphasize with users rather than creating more anxiety?
Storyboards

For the next step, I created a few storyboards around the topic of “Meaningful and thoughtful event planner” to visualize a scenario where users get help from my app. Here is an example of a user who got a “Job Interview” and wants to plan it ahead?

planrt-storyboard.jpg
Paper Prototype

From one of the storyboards, I created a paper prototype. This helped me to get an actual experience with flow a task in the app. In the following prototype, I focused on a user who wants to create an event for upcoming job interview:

planrt-paper-prototype
Plan, User Flow and Wireframe

I used Adobe XD to create my very first digital mockup from the paper prototype. I started with the home page, but before creating rest of the pages , I planned and scheduled a deadline for every single deliverables and features Based on my planning, I also created a user flow to have a better understanding of the user journey across the app. Whimsical is a great tool for creating flowcharts, and that’s what I used to create following chart:

Planrt-user-flow
Low fidelity Prototype

I added more pages and details to my prototype. In this stage, I also made the prototype interactive in order to be used for usability testing.

Planrt-LF.png
User Testing

At first, I made the mockup ready for in person user testing. I defined an interview protocol for myself and created a consent form for users to be confirmed and signed before the test.

I briefed my testers and asked them to go through two tasks, “Create an Event” and “Plan an Event”. I also asked user to “Think Out Loud” as they’re performing the tasks. In this way I could also listen to their trains of thoughts as they’re tapping/sliding on the prototype. I took notes and record videos on a few tasks to better analyze them later on.

I listed all the possible changes and revised the mockup. In the next stage I continued the user testing process in an online form.

In order to have a more efficient user testing process, I used A/B testing method for the online usability testing. I created two versions from the home page, and used usertesting.com to send each design to a group for evaluation and getting feedback.

Polish and Finalize

I gave my app a name. I’ve been looking for a smart and thoughtful planner, so I called it Planrt.

The very last stage was to apply all the changes from the user testing and other feedback, and create a high fidelity version. The UI elements from color and icons were finalized, and the interactions and transitions were improved based on the feedback.

Planrt-onboarding
planrt-UI.gif