The Script Reader
A responsive website for a small script consulting business for screenwriters looking to improve their screenplays.
Project Timeline: Aug-Sept 2022 (2 weeks)
My Role: End-to-End UX/UI Designer
My Tools: Figma, Otter.Ai, Optimal Workshop, Whimsical, Notability, Zoom, Google Suite
​
​
01.
OVERVIEW
Project Background
What does it take to write the next Hollywood screenplay?
​
The entertainment industry is hard to break into - most would say “it’s all about who you know”, but others say that “content is king”. They say it doesn’t matter who you are or where you’re from, if your story is good enough, then you’ve got a shot at getting your screenplay made into a film or TV series. But how do you sharpen your story into a narrative masterpiece? Enter script development. Script consultants examine the foundation of the story from an objective standpoint and give constructive notes on how to improve the script.
​
​
The Problem
The majority of aspiring screenwriters generally feel script consultants are not approachable, not legitimate enough, or too expensive for their current career stage as screenwriters (since this isn’t usually their full-time job). The client wanted his website to be a remedy for their skepticism.
​
Here is the client's existing website BEFORE any redesign.
​
​
The Challenge
How might we help aspiring screenwriters take the next step with their scripts by trusting in our script consultants' service?
​
​
The Solution
To re-design his existing website into a new responsive website to increase the overall traffic and call-to-action engagement for his services, while establishing a sense of helpfulness & trust with prospective customers through the website's identity.​
​
Here is the client's website AFTER the redesign.
​
​
02.
RESEARCH
Research Plan
My main research goal was to learn about aspiring screenwriters’ experiences when it comes to approaching professional help with their script and their writing process, so that we can fully understand what solutions would improve the website user experience. I wanted to investigate more into my initial assumptions about WHY screenwriters do (or do not) use consultants.
Objectives
-
Learn what action(s) aspiring screenwriters take when they finish a script
-
Understand their process for receiving feedback for their screenplays.
-
Understand why screenwriters go (or don’t go) to script consultants.
-
Determine how screenwriters feel about script consultants.
-
Determine if & how screenwriters order professional script consultations.
-
Learn what encourages participants to or prevents participants from paying for that service.
​
​
User Interviews
User Interviews
For this project, I knew a number of people pursuing screenwriting, so I reached out and conducted remote interviews over Zoom to hear their first-hand experience, with live transcripts being generated by Otter.Ai for later analysis.
​
Number of Participants: 4 males & 2 females
Ages: 30-40 years old
Other Qualifiers: All written at least 2+ screenplays.
​
​
Affinity Maps
Following the interviews, I listed out all of the important observations, quotes, frustrations, and thoughts onto post-it notes. Then, I processed all of this data into groups with a similar attributes, (typically clustering their responses by question) so I could see them all side-by-side and see what insights emerged.​
​
​
.png)
Insights
There were 3 key insights that I discovered during my interviews:
​
-
Most interviewees found value from simply joining a writer's group and hearing their opinions rather than pay a script consultant for their feedback.
-
Their friends (or friends of friends) often did script consulting as a side hustle, not professionally,
so they'd use them instead because there's already a basis of trust established.
-
There's skepticism over the lack of accreditation, which makes these services "inherently risky".
​
​
Competitive Analysis
Before diving into possible features for the website, I wanted to see what value the competition was offering, so I created a quick comparison of their services and features, circling a feature for each that I observed to be their key strength.
​
​
03.
IDEATE
User Personas
Now that we had a better concept of the qualitative data, I made a representative user composed of a mix of demographics, motivations, and pain points from the participants.​
​
​
Sitemap
I took a closer look at the information architecture, not wanting to simply use what was already in place. I conducted an Open Card Sort to see where features would land for people. In the chart below, we begin to see where items are similarly grouped by the majority of people.
I wish I had a larger sample, but with limited time, I took this data and structured the sitemap, with possible pages or proposed services the client could do for later expansion after the MVP.
​
​
User Flows & Task Flows
The primary task for the client's website is being able to order script coverage, being able to trust in the process. I focused my user flow on these interactions and decision points to see how steps could be simplified to make it as approachable as possible as well as being able to access this task from a variety of pathways.
​
I also created a path for the client to do his business primarily on his website. At the moment, prospective screenwriters looking to hire him would send their scripts over email and there'd be some back & forth. Now, what I'm planning on implementing, is a new way for him to drive all the script submissions through his website, not requiring users to send him a customized email. I broke down those steps with separate task flows.
​
04.
DESIGN
Wireframes
I like to sketch out my wireframes with Notability on my iPad. I've noticed the more projects I produce, the messier my lo-fi sketches become - and I think that's okay as it allows me to easily ditch past designs for newer ones without regret. I started drawing out the desktop screens, which would inform my mobile screens later on once I settled on a design style and began to create Mid-Fidelity versions of the wireframes sketches.
​
​
Brand Identity
The client had an existing logo and brand color that they liked and wanted to incorporate them in the redesign.
​
However, they were open to expanding the color palette and changing all the typefaces on the website. I kept a fairly neutral greyscale, while adding shades of red using the original brand color, and wanted some bright yellow CTA colors that felt like it belonged at one of Hollywood's premiere nights.
As for typefaces, I chose Outfit as their all-around workhorse to evoke a younger san serif feel that felt approachable with a bit of personality in the rare ligatures.
​
​
06.
TEST & ITERATE
Usability Testing
Before I got to that final MVP version, I had a V1, which I tested with several participants from my original user interviews. I evaluated whether they could complete the below tasks, as well as identify any areas of confusion in each step of those tasks.
​
Task Flows to Complete:
-
Schedule a Free Consultation [Desktop]
-
Order Script Coverage [Desktop]
-
Locate Information on Services Page [Mobile]
​
​
Analysis & Prioritization
I compiled the key observations (similar to my user interview analysis) for each participant, and then sorted them into categories that could be improved
I ranked the "problem children" based on what was most needed, either due to the poor user friendly score they assigned to each task, or the frequency of the issue for each participant. I attempted to solve them, based on the available time I had left.
​
For a closer look - click on the button for my in-depth analysis.
​
​
Improvements
Below are 3 main visual and usability improvements on the right side of the matrix made to the user interface, identifying what was problematic and implementing a solution to address it (other than increasing the legibility with the font sizing).
​
​
1. Locating the Coverage Rates on Mobile
​
Problem​
Each participant ultimately struggled to locate the other coverages rates for TV and short scripts on the mobile browser, missing the text prompt. The affordance of "swiping" wasn't clear and intuitive enough.
​
Solution
I added a toggle component, which serves as a signifier to users that other coverage rates exist on mobile. It only requires a tap instead of a swipe (although that functionality still exists, hinted by the card transitions should users prefer to navigate that way).
​
​
2. Finding the Free Consultation
Problem​
Some participants' mental models, led them to the services page immediately to find a free consultation (as a service), rather than the CTA on the home page.
​
Solution
Adding a banner at the top of the services page to highlight this service, therefore having it on the landing page and the services page.
​
​
3. More Meaningful Checkout
​
Problem​
Users felt the process was "too easy", almost to a point where they assumed that they may have made a mistake. Users would point to themselves as overthinking it, but in reality - there was a way to help them not second guess themselves.
​
Solution
There was a need to insert a thoughtful pause in the checkout flow - a timed processing page notifying them that their request is being submitted - where the users can receive a sense of feedback as they send off their scripts with a sense of reassurance.
​
​
07.
SHOWCASE
08.
REFLECT
Improvements
There are still some websites improvements that I could still continue to work on. Given the time constraints of the project - I feasibly couldn't satisfy all of the product improvements that I wanted. That being said, I'm proud of what was built, including the essential components to revitalize my client's business identity through his website.​
​
Takeaways
I always walk away from usability tests amazed at the quality of very sensible and smart improvements I could be making. Seeing what features aren't quite there, simply by observing participants. Having a checklist of priority changes is a real treasure. It is a great feeling seeing those small changes improve the product overall. ​
​
​