Tremble is a self-publishing app designed for literary horror fans seeking original content to read and listen to from a personalized feed catered to their interest. The project incorporates browse and search features, discussion boards, editors, and customization.
OVERVIEW.
Fans of literary horror: Wouldn’t it be great to access a library of compelling tales born from diverse minds of those that appreciate horror as much as you? What if you could personalize this library based on your preferences and interest and access it anytime, from anywhere? How much easier would it be to seek your next thrill?
Horror writers: Can you imagine the benefits of sharing your work on a self-publishing platform that allows horror enthusiasts to find horror stories that align with their interests? What about the amount of feedback and engagement on the discussion board for every tale you publish?
Tremble gives users the control they need to feel comfortable exploring the uncomfortable while discovering unique content contributed by the community and for the community. No more rehashes of existing Creepypastas or fan-fiction riddled with grammar mistakes – this is an app that focuses on providing horror fans with stories they’ll love to fear.
UX Designer
UX Researcher
UX Writer
Visual Designer
Content Strategist
Competitive Analysis
User Surveys
User Interviews
User Personas
User Stories
Sitemap
User Flows
Style Guide
Paper Wireframes
Hi-Fi Mockups
Clickable Prototype
Usability Test Results
Sketchbook
Sketch
Figma
Draw.io
Zoom
Skype
QuickTime Player
PROBLEM.
The internet has made horror stories easy to find and share. However, there is an absence of interactive, self-publishing platforms dedicated to the needs of literary horror enthusiasts.
PROCESS.
My first step was research and strategy, with which I discovered there was a target audience for a self-publishing app dedicated to horror stories in written and audio format. By learning the needs of the target audience through my research, I strategized on how I would approach the design of the product through information architecture. Then, I created a brand identity for the app before proceeding to mockups and building up a prototype or usability testing. I made several iterations throughout the design process and applied all feedback along the way – all of which you can see in detail further down.
SOLUTION.
On Tremble, horror writers can share their work with horror fans wanting to experience fear in written or audio format. Users can also tailor their feed to their interests and block content of disinterest from their experience without penalizing themselves or creators. They can also share, save, and discuss stories with others.
PROCESS > STRATEGY
To ensure there was a market for a horror storytelling platform, I did some research on Medium, Wattpad, and Spotify, three competitors in the digital media industry that specialize in content searching and two horror storytelling apps. With my findings, I was able to answer the following questions:
Asking these questions helped me decide what services I would be analyzing and paved the way for a user survey that would help me uncover the needs of potential target audiences.
Below are the pros and cons I discovered while doing secondary research for my analysis:.
Clean interface focused on text |
|
No ads |
|
Articles with an audio-reading of the text |
|
Community building through commenting, highlighting, and private messages |
|
Can be accessed from PC, tablet, or smart phone |
Only allows for more than a handful of free stories for non-members per month, while recommending mostly premium content to users |
|
Massive user base |
|
Fan-funding |
|
Supports over 50 languages |
|
Free offline reading |
|
Mentorship and development opportunities available |
|
Increase writer’s opportunity for exposure by hosting writing contests and awards |
|
Encourages in-person interaction by hosting annual Wattcon conference |
|
Young user base without disposable incomes makes the app difficult to monetize |
|
Disruptive ads negatively affect the user experience |
|
Inability to age-up the platform – users leave as they age |
|
A writer’s popularity is dependent on how engaged they are with their readers |
|
Writers must publish chapters regularly to maintain loyal reader base |
|
Has a reputation for housing low-quality writing |
|
Expansive reach |
|
Trials available and offered more than once for free users |
|
Ad revenue allows for agreeable free features |
|
Accessible with Google Home |
|
Extensive customization |
|
Sharing of songs and playlists |
|
Inability to view songs from artist without adding them to a playlist |
|
Podcasts only, no individual audio stories |
|
Can’t play specific songs without Premium |
|
Dependent on creators |
My competitive analysis showed me there is room for a horror storytelling app that not only allows users to personalize and discover unique horror stories but lets them contribute stories themselves. I had the following assumptions based on what I learned:
However, although there seems to be a space for this app, is there an audience for it? Whose needs can I fulfill with the app, and how could I best meet those needs?
I ran two surveys. The first was designed to uncover trends in storytelling preferences for storytellers, their audiences, and those who play both roles. The second helped me discover trends in horror story preferences from those who enjoy experiencing horror stories through a variety of mediums. I posted the surveys on Reddit’s r/SampleSize and Bloc’s various Slack channels. These are the highlights:
I ran this survey over 12 days and received 90 responses.
1. 50 percent of respondents prefer fiction over non-fiction stories
2. 50 percent of respondents play the roles of the storyteller and the audience
3. 80 percent of respondents that play the role of the audience AND storyteller, (45 respondents) prefer to express their stories in writing
Frustration with using Medium:
Frustrations with using Wattpad:
1. 52 percent of respondents were 18-25 years old when participating in this survey, with 22 percent being 26-35 years old
2. 48 percent of respondents were female
I ran the survey over 9 days and received 106 responses.
1. 88 percent of respondents enjoy horror stories
2. 46 percent of respondents enjoy experiencing horror stories alone and 40 percent enjoy experiencing horror alone AND with others
3. 54 percent of respondents prefer short horror stories, and 46 percent prefer long horror stories.
4. 72 percent of respondents revisit their favorite horror stories
5. 59 percent of respondents share their favorite horror stories
Reasons why respondents search for horror stories online:
Frustrations with online horror stories:
1. 43 percent of respondents were 18-25 years old when participating in this survey, with 22 percent being 26-35 years old
2. 52 percent of respondents were female
I would have liked to extend the run time for the storytelling preferences survey a bit longer to gain at least 30 more responses for a sample size of 100 respondents. I would have also liked to run another survey for audiences and storytellers to explore what their desired experience would be when interacting with a self-publishing app.
The most challenging aspect of user research was finding the right wording for the title of the survey and survey questions. For example, “Storytelling Survey” can mean a variety of things and is a bit vague, but “Storytelling Preferences” expresses that I will be asking respondents about their taste in storytelling methods.
I conducted five remote interviews with horror enthusiasts between the ages of 18-35 that live in the United States. I learned about the variety of experiences each interviewee had with searching for stories online. Almost all commented on how the internet made horror stories more accessible.
The Importance of Community, Intimacy, and Maintaining a Schedule
My first interview was with Josh, a former Wattpad user. From his experience, Wattpad does not uphold a standard that will improve the quality of work on the site. As a user, he spent time reading several stories that he eventually abandoned due to authors not committing to a consistent publishing schedule. Some stories were not updated for months and without warning. Did the authors desert their work and their readers? How could this be prevented?
My final interview was with Naja, who believes hearing someone tell a story is a more communal and intimate experience than reading. She also considers stories that are fleshed out and don’t cater to an audience to be more enjoyable. “Fear is vulnerable. It forces the audience to go in the darkest pits of their minds. Horror stories need to be thought out, and writers cannot afford to be lazy."
As a writer herself, Naja thinks self-publishing is a great way for authors to have their work discovered while avoiding the "B.S. of the publishing house block."
Here are more opinions gathered from my interviews:
After reviewing survey results and the notes I took for each interview, I created three user personas that would help me layout my target audience’s various backgrounds, goals, needs, and motivations. Creating these characters helped me refine initial requirements and land on tasks that were essential enough to be considered for the MVP.
Persona #1 | The Aspiring Voice Actor
JOHN WALKER
WORKING SINGLE PARENT
DEMOGRAPHIC
|
Age |
25-36 |
|
Occupation |
Customer Service |
|
Location |
Atlanta, GA |
|
Gender |
Male |
|
Tier |
Storyteller |
"I want to present my work on an immersive platform can expose me to my desired audience. I also want to share my joy of horror with my child at his level.”
John is a single father of one who spends most of the day working as a customer service representative at a local gym. When he's not working, he divides his time between his passions – filmmaking and voice-acting – and bonding with his 8-year-old son. More often than not, he does them simultaneously and brings his kid to gigs when allowed. John hopes to make a living off his passions someday. His hobbies include Dungeons and Dragons, watching movies with his son, writing and filmmaking.
John misses the experience of being terrified as a child and would love to experience the same feelings as an adult. He loves the breadth of stories available to him online. However, they often fail to meet his expectations due to a lack of authenticity, distractions from typos, and unpleasant formatting of written pieces. John is also looking to publish his work for others to enjoy and would like to do so on a platform that values horror and quality over quantity.
Persona #2 | The Young Author
ZADIE DAVIS
BUSY COLLEGE STUDENT
DEMOGRAPHICS
|
Age |
18-25 |
|
Occupation |
College Student |
|
Location |
Chicago, IL |
|
Gender |
Female |
|
Tier |
Dual User |
"I want the opportunity to grow as a writer by engaging with a community of peers and audiences that have an appreciation for storytelling."
Having lived in Okinawa during her childhood, Zadie has grown an appreciation for different cultures and finds excitement in exploring the unknown. Now a college student living in the states, she enjoys studying and reading both English and Japanese literature – folklore in particular. When she's not studying, she spends a lot of time editing for her school's literary magazine in communal spaces on campus. Her hobbies include dancing, writing, and reading.
Always looking for ways to build her craft, Zadie has been an active user of Wattpad since high school but is looking to transition to a self-publishing platform for older audiences that value quality, fictional works. Now studying Creative Writing in college, she wants to improve her craft through collaboration, critique, and discussion with others while publishing works in her favorite genre – horror. An inspiring home for her work that allows her the opportunity for improvement would be most ideal.
Persona #3 | The Horror Enthusiast
SYDNEY HALL
ADVENTUROUS TEENAGER
DEMOGRAPHICS
|
Age |
18-25 |
|
Occupation |
High School Student |
|
Location |
Aurora, Colorado |
|
Gender |
Female |
|
Tier |
Audience |
"I want to discover and keep track of my favorite horror stories in one place and have the ability to access them during camping trips and travel. I also want to share my favorites with others."
In her senior year of high school, Sydney would love to have a part-time job for spending money, but her parents prefer she focus on her education. Having to commute to and from school, she enjoys listening to podcasts and audiobooks to pass the time. Her hobbies include discussing various topics with others on Reddit, participating in ARGs, and gaming.
Introduced to horror through her family's tradition of participating in Halloween festivities, Sydney loves the feeling of excitement she gets when spooked. The nostalgia of oral storytelling around a campfire has led her to seek out horror podcasts and audiobooks to listen to while traveling and completing simple tasks at home. Sydney would love it if she didn't have to scavenge the internet for exceptional horror voiceovers that imitate the campfire experience.
PROCESS > Information Architecture
When I first created user stories, they consisted of five different users: new users, returning users, the storyteller, the audience, and the editor. However, because I was creating an MVP, I revised my user stories to reflect the actions that would fulfill project requirements while meeting user needs. I organized tasks by user role and prioritized their importance based on project requirements and survey findings.
| Role | Tasks | Importance |
| New User | Create an account | High |
| New User | Customize feed | High |
| New User | Explore platform | High |
| Returning User | Log into account | High |
| All Users | Browse and search for a story to read or listen to | High |
| All Users | Select a story to read or listen to | High |
| All Users | Favorite or bookmark a story | High |
| All Users | Create a story | High |
| All Users | Play audio for a story | Medium |
| All Users | Comment on a story | Medium |
| All Users | Search for a user | Low |
| All Users | Follow a user | Low |
The user stories helped me create user flows that would illustrate a journey through the clickable prototype. With this in mind, I sketched them out on paper before transferring them to digital.
After user flows, I created a sitemap showing how users can navigate the MVP to complete tasks. Navigation should be efficient and direct, with relevant content in the right place – no rabbit holes to get lost in.
Sitemap originally create for a website prototype.
With a sitemap and content strategy done, I roughly sketched out the screens I planned to include in the prototype based on my user flows, which were followed by detailed paper prototypes for usability testing. I performed my tests casually, having friends and family complete tasks by interacting with the paper prototypes.
Based on the feedback I recieved, the design was easy to navigate. I then worked on a content strategy to define the structure I wanted to give each page before creating a brand identity.
The wireframe for the app's home screen, which was tested as part of the paper prototype.
PROCESS > VISUAL DESIGN
Looking back on my research, I did not want the branding for the app to be outright terrifying. In the horror storytelling survey, I asked respondents what their least favorite type of horror was. The majority answered with "gore" and "slasher" horror, so I made a note to exclude visceral and violent imagery from branding. I assumed this to be the case, but it's great to have data backing me up.
While the point of the app is to be a literary haven for horror lovers, it must function as a tool that introduces horror to those who have never sought it before. Such people would be children and those sensitive to visual horror. To make exploring the uncomfortable comfortable, I wanted to go for characteristics like weird and odd. In what ways could the app be offputting, yet inviting?
The Brand Name
The first step I took with branding was coming up with a name. It was difficult at first. With all the listmaking and mind-mapping I did, I couldn't come up with a name that best represented the personality and purpose of the app. Every word I came up with sounded like something I heard before. I reached out to my friends and family, told them my issue, and they helped me brainstorm based on what I wanted the name to convey. With their help, I decided on Tremble because of how it evokes a familiar feeling associated with experiencing discomfort, terror, horror, and repulsion.
My sketched out list-making technique.
My sketched out mind-mapping technique.
Moodboard
The moodboard I created had images from cinematic horror - vibrant blues, yellows, purples, greens, and reds that played significant roles in movies. I drew inspiration from horror comics, drawings, eyes, and cinema.
I used Pinterest to create the moodboard for Tremble.
Brand Color
Because red is often associated with elements of horror – blood, evil, and anger – I attempted to try something different by checking out stills from horror cinema with excellent cinematography. I decided I would use green as my primary color, red as a secondary color, with black and white as my background colors. I chose green because instead of going for something outright horrific, I felt it would give Tremble a ghoulish vibe – enough to be considered creepy.
#31BF2C
#FFFFFF
#2B2B2B
#F21B1BF
However, I shared my reasoning with peers and my design mentor, and the feedback I received made me reconsider:
"The green makes me think of aliens."
"The green makes your LOGO look like an alien."
"I don't see horror, but I do see sci-fi."
"I'm reminded of toxins."
Not what I expected, but I decided not to fight the obvious. A dangerous, ominousness, bloody red was the way to go. Typical for the genre, but it gets the point across. I also replaced black with a dark navy, which is a bit softer and reminiscent of a night sky.
#F21B1B
#FFFFFF
#31BF2C
#8ED943
The Logo
I did a lot of brainstorming and sketched out different concepts for Tremble's logo. I wanted to incorporate eyes into the logo because the fear of being watched can creep up on someone invested in a good horror story. After going through many ideas and formats, I decided to create a logo mascot to pair with a logotype as the official logo.
I designed a variety of mascots using different looks and colors. After sharing the designs with others and getting feedback, I chose my winner.
Tremble logo in black and white
Tremble logo in color
The Typefaces
I chose Libre Baskerville as the brand font because, while the Baskerville typeface has a history of being used in books, Libre Baskerville is more legible on digital devices. Source Sans Pro contrasts Libre Baskerville well and adds a modern touch when the two are paired together, creating a perfect pairing to uphold Tremble’s brand personality.
I initially used Sketch to create my first round of high fidelity mockups for the clickable prototype. Using my paper wireframes as a guide, I designed refined, digital replicas in Sketch while applying the branding decisions I made earlier. It was here that I could examine whether my content strategy was successful or not, from my perspective at the time.
One thing I struggled with here was finalizing my color palette. Applying green as a primary accent color and red as a secondary accent color was not exhibiting the user experience I was trying to give. The palette was hard, and I received feedback that it was evocative of science fiction, toxins, and aliens – not a hint of the ghastliness I was trying to convey.
My desire to avoid using red as a primary color was getting in the way of the practicality of using what makes sense. Logic won in the end, and I decided to go with a nightly theme instead, replacing black with a dark navy and using red as the primary accent color.
It was also tough finding suitable visuals for empty states. There weren't many horror-related visuals out there, so I got creative with my UX writing to connect the visuals I chose with the app experience.
The finalized library screen in an empty state, with visuals supported by narrative copy.
PROCESS > usability testing
DDC Suggestions: Account creation, icons, and visible options
I got a lot of good feedback after submitting my mockups to Bloc's Daily Design Critique (DDC), and received the following suggestions:
1. Add icons to the “Read” and “Listen” tabs
Listen and Read tabs before iteration, without icons.
Listen and Read tabs after iteration, with icons.
Create Account: Before Iteration – Create Account
1. "What is your first name?"
2. Insert first name
3. "What is your last name?"
4. Insert last name
5. "What is your birthday?"
6. Insert birthday
Create Account: After Iteration
Profile creation in a single-screen form
Onboarding Process: No Progress Steps
Content blocking screen without indication of what step it is in the onboarding process
Onboarding Process: Add Progress Steps
Step 1. Create Account
Step 2. Block Content
Step 3. Topics of Interest
Interest screen before iteration, with searchbar.
Interest screen after iteration, without search bar (removed to simplify the onboarding process).
The save option in the story editor, hidden in a dropdown under the "more" icon.
The save option in the story editor, visible to the user but in a disabled state.
Block content screen before adding content warning
Blocked content screen after addinc content warning
After updating my mockups, I shared them with my mentor, who recommended I transfer them from Sketch to Figma for prototyping. It wasn't until I did this that I noticed how big the image files in my mockups were. They were pretty massive files, so I decreased their sizes and optimized them, which sped up the loading time of my project.
I scheduled two in-person and three remote usability tests with five people after building my prototype. All testers considered the app intuitive and did not recommend changes, but as I observed them navigate the prototype, I noticed inconsistencies in my design.
Listening tab before iteration
Listening tab after iteration
Inclusion of only abuse and child abuse before iteration
Inclusion of types of abuse after iteration
Inclusion of body horror as a blockable option
Inclusion of mutilation as a blockable option
User profile without customization
User profile with customization
Bottom navigation with "Search" and "Stories" before iteration
Bottom navigation with "Explore" and "Create" after iteration
Assessor suggestion: Refine "Create Story" process
After I updated the clickable prototype, I presented my project to a senior designer. With the feedback I received, I decided to refine the user experience for creating a story on the app. My assessor's recommendation was that I create two separate paths for publishing content – one for written content and one for audio content – because the option to upload a story was not immediately visible to the user with the "Write Story" button.
Create Story: Before Iteration
1. Stories screen's drafts tab in empty state
2. Story details screen in empty state
3. Story details screen with inputs
4. Story editor screen in empty state
5. Story editor screen in used state"
6. Stories screen with saved story under drafts tab
Create Story screen: After Iteration
1. Updated create story screen with draft tab in empty state
2. Updated create story screen, with option to write a story or upload audio
Write a Story Proccess
1. Story details screen in empty state
2. Story details screen with inputs
3. Story editor in empty state
4. Story editor in used state
5. Updated create screen with saved story under drafts tab
Uploaded Audio Proccess
1. Story details screen in empty state
2. User's mobile gallery, photo upload
3. Story details screen with uploaded photo
4. Story details screen with inputs
5. Updated create screen with saved story under drafts tab
Conclusion
If I had more time to expand more on the project, I would have loved to create a website design prototype as well. I decided on a mobile-first approach because, based on my research, having a mobile prototype would meet users' needs. However, I was also aware that having an online version of Tremble would be essential to its success as a self-publishing platform. I assumed users would rather type out stories on a PC instead of mobile, so having a website version of Tremble to show would have been a nice touch.
Some of my original user stories did not make it to the mockup stage. I did not want to overwhelm myself with unessential features that did not have to be included in the MVP for it to be complete. If I had more time, I would have liked to expound on the following:
Instead, I chose to focus on designing a prototype that allows for the following tasks to be completed:
As a horror fan, I enjoyed working on this project. It gave me a chance to explore a problem I am familiar with and attempt to solve it by applying what I’ve learned as a student apprentice at Bloc.
