Artivity
Context:
There are many reasons and benefits as one picks up a certain craft or hobby. Hobbies such as crafting have also seen a great rise in popularity due to the pandemic, personal enjoyment, decreasing stress or anxiety, sustainability, or entrepreneurship.
About
Art + Productivity = Artivity
Art and productivity combine in an exciting new app for creatives! On Artivity, users can create projects and to-do lists to manage every step of your project. Users can also create “brain dumps” to store their thoughts, tips, tricks, and more all in one-convenient place.
Time: 100 hours, December 2023- January 2024
Role: UX/UI Designer and Researcher
Tools: Figma, FigJam, Whimsical, Maze, Google Meet
Ideate
After completing my research, I began to develop ideas and potential solutions as to what Artivity would look like and how the information on the app would be structured. My primary goal during this stage was to figure out how to keep this app stress-free and also be an additional and useful asset to the user.
I began by creating task flows and planning what the features would look like. These three steps really helped me finalize the direction I wanted to take Artivity before I started my sketches and mock-ups.
Task Flows
Before I started sketching, I created the following task flows. These were used to imagine and plan what the user would go through when using Artivity.
Onboarding & Creating An Account
Set-up A New Project
Add A Tip To A Brain Dump
Get A Project Idea
Feature Set
I also laid out the following feature set to help me prioritize the features I wanted to explore and build out first.
My must-haves I had going into my sketching and design was:
Project Tracker
Brain Dump Section
Inspiration Section
Sketches
I took the opportunity to do some sketches to get the overall look and feel of Artivity. My main goal with these sketches was to explore different designs for the key features I wanted to have.
I also used my time sketching to play around with different layouts to see what I thought would work best with my key features. I had certain design ideas I wanted to explore such as project cards and to-do lists, but I just needed to play around with various layouts to get the “right one.”
Design
After creating my initial sketches, I began to further build out my ideas. This included creating the Artivity brand, as well as designing my hi-fidelity wireframes for testing.
Branding
For Artivity’s branding, I selected vibrant and bright colors that represented ambition, happiness, and tranquility. All of these are aspects art can bring to a user.
The spark in the logo is representative of the "creative spark" one has when getting started on a new project.
Hi-Fidelity Prototype
With my branding finalized, I was then ready to create my first prototype for testing. When designing my hi-fidelity frames, I wanted to use and experiment with colors! I wanted to convey the bright and inspiring tones all throughout Artivity and on its various key screens.
I primarily used color in the cards for the “My Projects” and “Brain Dumps” pages as a way to help users quickly differentiate between the different items on the page.
I also designed pages such as the brain dump and individual project views to be customized to the user and used in a way that would benefit them the most.
Test
I conducted my user testing with five participants on my prototype of Artivity. I tested the following flows during my user test:
Create An Account
Create A New Project
Create New Brain Dump
Results
I found my user test to be a great success! Tasks were completed in accordance to their success metrics and I also received great feedback to continue to improve Artivity’s design and UI. Below is a breakdown of each flow I tested:
Create An Account
Users commented the UI was nice and felt familiar to other design patterns seen on other apps they use.
Users also had positive feedback about the app's overall branding and colors!
Create Brain Dump
Users had the most issues with completing this task.
About roughly half of my participants had some type of error with this task.
Users mostly struggled with figuring out where to create the new brain dump.
All users expressed wanting a clearer “new” button on this page.
Users found the “+” button to be unclear when looking at the main brain dump page.
Create New Project
The only pain point users expressed was the amount of “+” signs on the screens.
The majority of my participants were confused by them and the purpose they served.
Users suggested fewer “+” buttons on the page to ease any confusion.
Iterate & Final Version
From my test results and feedback, I made the following changes in my final iteration of Artivity. I made changes to the main Brain Dump page and the individual project page.
Based on user feed back, I added a more prominent “Create New Brain Dump” button on the Brain Dump page. I also added a page heading to help users remember what page of the app they are on.
On a specific project’s page view, I removed the “+” in the top right corner. Users expressed there was too many during user testing. In my latest iteration I removed it to give a more streamline look.
Final Prototype
Reflection
Topic of Choice
I enjoyed working on a project with a topic that spoke closely to me. As a creative and artistic person, I found picking an app related to this topic kept me invested throughout every step of the design process. I also felt it made my interview and user participants excited as well! They all enjoyed talking about their various projects and hobbies and discussing how Artivity could possibly help them out in their creative process.
Iterations
I was really glad I got the chance to iterate multiple times while working on this project. Be it from user feedback or my own personal design choices, I felt I was pushing myself in my design choices. I also felt having multiple iterations allowed me to come up with even better solutions to overall user problems, and problems that arose in testing.