GenialTask (UX)
GenialTask
Note: The GenialTask team (Egor Komarov and Vadym Bigun) did not request me to create this heuristic evaluation and new design for them. This project is solely for personal skill development.
My version of the existing app GenialTask, based on my personal heuristic evaluation.
Tools
Adobe Illustrator, Adobe Photoshop, Adobe XD, Balsamiq, Clip Studio Paint, Google Suite, Microsoft Powerpoint, Microsoft Excel
Methodologies
heuristic evaluation, paper prototyping, sequential storyboards, wireframes
Heuristic Evaluation
As a student, I take great interest in task management tools. That is why GenialTask and its clean design caught my eye on the Google Play Store. Its beautiful colour scheme and crisp visuals are definitely some of its strongest points. However, as my heuristic evaluation will point out, the app could still improve in some areas. Still, although a heuristic evaluation (ideally with at least three evaluators) is more convenient than actually going around and consulting real users about the product (as I did in my Squirrels project), it suffers from a severe disadvantage, which is just that: it does not involve real users. Therefore, I would not consider this evaluation to be the end-all for this project, but rather more of a supplement or aid.
A sequential storyboard I made for the current GenialTask app.
For this evaluation, I used Jakob Nielsen’s 10 Usability Heuristics for User Interface Design. While analyzing GenialTask, I noted on Microsoft Excel which usability heuristics the app is breaking, how severe it is, what the exact issues are, and what I would recommend to improve it. I also made use of other apps like Google Tasks and Tasks and compared them to GenialTask. My heuristic evaluation table below shows that GenialTask needs improvement in four of the 10 usability heuristics.
| Usability Heuristic | Severity (0-5) | Issues | Recommendations |
|---|---|---|---|
|
User control and freedom |
4
|
Cannot undo action when tasks are deleted; jarring when the screen suddenly changes to the "All Tasks Completed" screen when I may not actually be done with all of the tasks for the day (what if I want to add more tasks later today?); ability to add tasks confined to today and tomorrow |
Add undo buttons when deleting tasks; integrate "All Tasks Completed" into task screen as not to assume that all tasks for the day have been completed; add ability to add tasks due for any day |
|
Consistency and Standards |
4 |
The checkmark when adding tasks looks out of place; menu icon represented by three dots is confusing; swiping left on the task does not reveal an option to edit and/or delete it (it instead goes to the "Tomorrow Tasks" screen) - to delete or edit a task, the user has to long tap the task |
Simplify the checkmark or just change it to an "Add" or "Save" text; change the menu icon to the standard menu icon (represented by three lines instead of three dots); when the user swipes left on the task, there will be an option to edit and delete it |
|
Recognition rather than recall |
3 |
The app does not sort the "Tasks" screen by tasks that have already been completed and tasks that are yet to be completed (they are instead always sorted by the time they have been added); no ability to tag, label, or categorize task |
Automatically divide the "Tasks" screen by complete tasks and incomplete tasks; add ability to label and search for tasks |
|
Flexibility and efficiency of use |
4 |
Tapping the keyboard's enter button does not add the task (it instead creates a new line) |
Allow quickly adding events using the keyboard's enter button but also give option of adding details or labels to tasks |
Prototyping
After completing the heuristic evaluation, I proceeded to create my prototypes. I started with a low fidelity paper-type prototype on Clip Studio Paint, and ended with a high fidelity prototype, done on Adobe XD.
Low Fidelity
I created my low fidelity “paper prototype” on Clip Studio Paint, and created its sequential storyboard on Microsoft Powerpoint. What I wanted to focus on at this stage was the placement of the different objects and elements, as well as the presence of important features, such as the ability to filter and search for a task and the ability to add tasks for any day (not just today and tomorrow, like the original GenialTask app limits). Visual improvements have also been outlined, such as the simplification of the original checkmark when adding tasks, into a simple “Add” or “Save” text.
I wanted to make the app as seamless and smooth as possible, so I also prioritized narrative, such as what happens when a task or all tasks have been completed. As seen in the sequential storyboard, a basic image (represented by a box with an X over it) appears and disappears out of the task screen, depending on whether there are tasks listed on it. To avoid the jarring instance in the original GenialTask, wherein the screen suddenly changes to an “All Tasks Completed” screen (and thereby assumes that I have already finished all my tasks for the day when that may not be the case), I integrated the task completion screen into the task screen, as seen on the fifth screen in the storyboard.
Medium Fidelity
Some minor changes to the low fidelity design have been done, as seen in this medium fidelity design, which was created on Balsamiq. For example, the calendar representing the ability to change the date a task is due has been changed to a button that on default says “Today.” When the due date is changed, the button also changes to the respective date.
High Fidelity
For the high fidelity design, which was done on Adobe XD, although I wanted to focus more on aesthetics (as is the nature of high fidelity designs), I also found opportunities to improve the medium fidelity design.
For example, I realized that the “Completed Tasks” menu needs to be consistent across all screens. That means it needs to either on default always list all tasks, or simply be a drop-down menu. For the sake of simplicity, I chose the latter. Furthermore, the phrase, “What do you want to do today?” implies that the user can only add tasks for today, which is not the case. So, I changed that as well to “What do you want to do?” I also added the ability to label tasks, to make organizing and searching for tasks easier.
For the colour scheme, I decided to keep GenialTask’s original main colours, which are #FF7973 and #FD709D. I also changed the original top menu bar colour to light gray, as I found the dark purple to be distracting. Finally, I chose to keep GenialTask’s smiley face mascot and integrated it more into the design, though I created my own rendition of it using Adobe Illustrator and XD.