PROJECT | querymuch
10 min read
OVERVIEW
querymuch is a mobile app that I designed based on a need for writers and literary agents to connect on a streamlined, automated platform. querymuch simplifies the query process, making it efficient and manageable for both literary agents and writers.
THE DETAILS
MY ROLE
Launch Code UX Project | Lead
TEAM
Rachel Zolotov | Solo
DURATION
January – July 2020
TOOLS
Photoshop | AdobeXD | Balsamiq | InVision | Mural | Google Sheets | Validately | Draw.io | Google Slides | Zoom
THE CHALLENGE
Create a mobile app that is effective and easy to use for both literary agents and writers
THE PROBLEM
As of March 2020, there is no streamlined query process. The query process consists of repetitive manual steps. There are no mobile apps available. Several websites exist, none of which are up-to-date and none are mobile-friendly. Every agency and even agent has their own submission guidelines, making the query process a lengthy and stressful process for the writers. Agents are typically overwhelmed with queries without a way to sift through them quickly, efficiently and on-the-go.
UX METHODS
Competitive Analysis | User Interviews | Personas | Empathy Maps | Journey Maps | Mind Maps | User Flows | Sketching | Wireframing | Low-Fidelity Prototyping | Usability Testing – Moderated & Unmoderated | High-Fidelity Prototyping
THe process
EMPATHIZE
conduct research
DEFINE
pain points
IDEATE
brainstorm & sketch
PROTOTYPE
low & high-fidelity user interface
TEST
gather feedback
discovery
COMPETITIVE ANALYSIS
To begin, I analyzed 5 websites that offered similar services.
MAIN FINDINGS
• no websites had a mobile app
• no services provided strengths for both agent and writer
• all were time consuming and repetitive options
• very limited automated services
USER RESEARCH
INTERVIEWS & OBSERVATIONS
I interviewed writers and literary agents to collect qualitative information about their querying experiences in order to pinpoint major challenges.
KEY INSIGHTS
• writers want feedback and status updates on queries
• agents need a way to look at and respond to queries on-the-go
• both like a simple all-in-one place to view, send and respond to queries
• the query process takes too much time
TOTAL INTERVIEWS
0
phone interviews with writers
0
online interviews with writers
0
phone interview with an agent
0
online interviews with agents
RESEARCH INSIGHTS
USER PERSONAS
After conducting the interviews, I organized my observations into a map. This helped me to see the common themes, user needs and pain points.
Once I understood my users, I was able to create the personas.
“Personas remind us of the goals and behaviors of our user groups.”
EMPATHY MAPS
The Writer’s Goal
“Find an agent that loves my manuscript and will believe in my work enough to get it published.”
The Agent’s Goal
“Quickly and efficiently find a query in the ‘slush pile’ that catches my attention. Hopefully I love the manuscript enough to take it on and champion the work to get it published.”
JOUrney MAPS
CURRENT STATE & PROPOSED
In order for me to understand my users behavior before they use querymuch, I needed to visualize the actions my users were taking on their querying journey.
KEY INSIGHTS
• where the pain points were along the journey and what solutions could solve them
• what could motivate the user to use my app
• opportunities that I could apply to the proposed journey for querymuch
CURRENT JOURNEY MAPS
agent and writer
“In order to create the most positive experience for my users, I needed to apply the opportunities from the current journey maps so that I could minimize the areas that caused negative emotions.”
PROPOSED JOURNEY MAPS
Future state journey maps show how agents and writers will experience the querymuch app.
BRAINSTORMING
MIND MAP
Once I had researched my users and defined their pain points and needs, I was ready to move into the ideation stage. The first step was to brainstorm and organize my ideas into a mind map.
DESIGN EXPLORATION
USER FLOW
To get an idea of how the user would navigate through the querymuch app screen by screen, I created a user flow diagram for each of my user types using Draw.io.
KEY INSIGHTS
• gave me a clearer picture of what each screen needed to have
• helped me visualize so I could make decisions about how to organize my app
• inspired me to continue brainstorming and enabled me to come up with more ideas
CREATIVE THINKING
SKETCHING
So far, I have empathized with the user, defined the pain points and researched how I can make querymuch a positive experience. Next, I needed to put my pencil to the paper and bring my ideas to life.
“It’s okay to mess up… sketches are meant to be a flow of ideas.”
WIREFRAMING
Using Balsamiq, I transferred my rough sketches into wireframes. This allowed me to have a better visual to work from before transitioning into the prototype.
Previous
Next
DESIGN
LOW-FIDELITY PROTOTYPE
I created my art-boards in Photoshop and transferred them to InVision to create a clickable prototype.
KEY INSIGHTS
• I needed to de-clutter my art-boards
• in order to create a more realistic prototype I needed to add more screens
• thinking back to my research and reminding myself of what the “users” needed was crucial to my design
view the low-fidelity prototype here
USABILITY TESTING | Round 1
MODERATED TESTING
In order to reveal points of friction and areas of confusion as well as any bugs in my prototype, I needed to conduct usability tests.
After testing, I compiled and organized my findings in a map. Then, using Google Slides, I made a report with my results.
DESIGN ITERATION
BEFORE & AFTER LOW-FIDELITY
After completing my usability testing report, I applied the solutions to the low-fidelity prototype.
The main problem areas were the keywords and the swiping functions.
KEYWORD SCREENS
before & after
One of the key findings from my usability testing was the issue with the swiping function.
Although all the participants enjoyed the swiping function once they understood how to do it, it caused confusion for the first time. InVision prototyping did not properly support gestures, so the swiping proved to be very buggy.
PROBLEM
This onboarding screen for swiping was not clear enough since every participant skipped over it.
SOLUTION
New swiping onboarding screens
Another issue was not having a “go back” or undo button once a query or synopsis was dismissed.
I also wanted give an additional way to dismiss or accept with buttons as well as swipe, so I added a bar at the bottom for these options.
With this change, I was also able to bring the save button down and modify the pop-up to look cleaner.
“Listen to your users. Iterate, iterate, iterate.”
During the usability testing, a literary agent mentioned a function in the settings that she thought would be very helpful, so I added it with an additional screen.
This setting would allow the agents to set a red flag based on word count.
USABILITY TESTING | Round 2
UNMODERATED TESTING
After correcting the pain points found during the first round of testing, I recruited 4 more participants to do unmoderated tests.
I organized the results and added to the report.
DEFINING PATTERNS
LOGO DESIGN
To create my logo, I first sketched out several designs. I knew I wanted something modern and simple, and a logo that utilized the Q & M from the name. Once I decided on the one I liked the most, I created the logo in Photoshop.
DESIGN STYLE GUIDE
Accessibility testing
VISUAL DESIGN
HIGH FIDELITY PROTOTYPE
After assessing all of the data from both rounds of usability testing, I found that most of the pain points the users experienced were because of issues with the InVision tool. Because the swiping functions were not properly working, I decided to switch to Adobe XD for my high fidelity prototype.
WITH ADOBE XD I WAS ABLE TO
• seamlessly integrate the swiping gesture
• add animations to make the app look and feel like a real app
CLICK THROUGH THE HIGH FIDELITY PROTOTYPE BELOW
A GLIMPSE INTO THE WEB OF PROTOTYPING IN ADOBE XD
A SELECTION OF THE ON-BOARDING SCREENS
A SELECTION OF SCREENS FROM THE AGENTS PATH
A SELECTION OF SCREENS FROM THE WRITERS PATH
0
ITERATIONS
0
ARTBOARDS
0
CUPS OF TEA
REFLECTION
CONCLUSION AND NEXT STEPS
querymuch was my first introduction to the UX field. I am very proud of what I achieved with this project. I feel as though I created a design that solves a problem and tackles the user pain points in a useful way. The final design is visually pleasing and functional. Both the content and design of this project was based on the research and the users needs in mind.
Although I have finished work on this study, there is plenty of room to come back and iterate on it many more times. I would begin by conducting another round of usability testing and doing another iteration of my hi-fidelity prototype. Then, if I were to continue and take this project to the next level, there are a few functions I would add.
• a feature for the agents to send an invite link to the writers for them to be able to send a query directly to them. This would be particularity useful if the agent met the writer at a conference or through a pitch contest
• I would also show how a red flag would appear on on a query and/or manuscript or even make the app more intuitive by knowing what the word count should be based on genre
• a settings menu showing the specific settings they can get back to and change if needed
• a functionality for the agents to be able to “add an intern” to their account and assign them queries to go through for them
• a bio page on the agents that the writer would be able to click on and view
• a pop-up that would show on the agents phone when a new query or queries are available to read, or for the writer when a query, synopsis, and/or manuscript have been accepted
• an FAQ page
• full page mode when the agent is reading the manuscript
