PenQuill
Users should be able to use multiple forms of media when taking notes onto their journal. They should also be able to share their files to social media if they are willing to. PenQuill is a journalism app that has functions being able to take notes and have multimedia all within the same page. With these challenges in front of me, here is the process on how I executed this app.
The Challenge
Users should be able to use multiple forms of media when taking notes onto their journal and share it when they want to.
The Solution
Make an app based off of the demographics, preferred channels/content types, and reviews. I also want it to be able to have the functions of sharing multimedia files to social media.
My Role
As a team of one, I needed to wear multiple hats. I served as the UX researcher and the Product designer
Demographics and Psychographics
Key Demographics:
- Age range: Young to middle adults
- Gender: Both male and female
- Common jobs: Journalists, analysts
Key Psychographics:
- Values: Organization
- Likes to: Journal/take notes
Interviews
Before diving into the project, I needed to interview people and get some takeaways on how to produce an optimal prototype for the PenQuill app. Based on the interviews this what was important:
- How might we make it easy to see the benefits of using this app?
- How might we find it easy for people to share their notes to other people?
- How might we find a way to make the app be free for users?
- How might we make the app functional while remaining its aesthetic?
- How might we add add a function to let the user add multimedia files to their notes?
Competitive Analysis
The two apps I looked into when it comes to journalism type apps were Evernote and Happyscribe.
For Evernote one thing that I took into consideration was that it allowed you to add images to one’s text documents.
As for Happyscribe, it allowed you to submit a video and/or audio file into text documents.
However, a disadvantage I found when using these apps is that they both required a subscription fee.
Personas
Based off of the research, I created two personas that have various goals and pain points to cover.
Journey Map
Then I made a journey map of what a user would experience when using the app.
Initial Sketch Flow
Afterwards, I made a sketch of the first stages of how the app would flow while also focusing on the main goal and questions.
Idea Sketch
The idea sketch was then made for branching out what else needs to be added for the app.
Crazy Eights Sketch
Crazy eights is another form of paper wireframing technique that I decided to use for this project.
Solution Sketch
The last thing I did before transitioning to the digital process is to make a solution sketch. This shows additional notes on what the user would expect in the app and a three part guideline on how to go through the app.
User Flow Experience
Afterwards I refined the layout of the user flow experience to have a cleaner idea of what to do. I also listed the user stories.
Typography and Color Schemes
Here is the text I used to make sure it's readable for the user when looking through the app. I also have the color schemes to show what I was aiming for when it came to contrast accessibility.
Mood Board
Here is my mood board for my Lifestyles app. This influenced the style on the UI and the colors I wanted to use for the app.
Wireframes
Here are some samples of the wireframes I made to get a further idea for my high fidelity prototype.
Login Page
Home Page
Document Page
High Fidelity Prototype
Here are some samples from the high fidelity prototype of the project.
Home Page
Add Photo Page
Save Page
Usability Reports
Based on the tests, these were the reports I got out of my app:
- The design layout was really great to look at according to the reviews
- An improvement that was suggested is that the sign up page needs a function to go back to the login incase one were to accidentally go there
- Another one is that the "add audio" page needed a record button like how the "add image" page has a camera button
Takeaways from the Project
- The UX research part is important to me so I can match it with the UI design part of the project
- Doing this type of a project for myself made me feel more responsible on how to make a thorough prototype
- This gives me a great impression on how projects would work in the future when creating these kinds of interfaces
- Through this program, it shows how important both skills in UX and UI are needed in a worker’s kit
Next Steps
- If I would continue to make this app I would add a folders function so it can be more accessible to access specific files and manage them better
- I would also add a sort feature based on how recent or a favorites list as well
- Lastly, I would add a share function so it can be added into an article or social media or to friends