Sleep + Recharge
UX Research, Visual Design, and Content Writing
Email Newsletter
Focus
Infographics
Content Writing
Research
Science Translation
Visual Design
Email Newsletter
Coherent Read
Tools
Sketch
Adobe Illustrator
Photoshop
Keynote
Unsplash
Preview
Adobe Acrobat
Overview
With 89% of people in the Nation reporting sleep problems, a read on how to get a better night’s sleep and how sleep works seems relevant for people who may want to learn more about their sleep patterns in a simple and engaging way. This project takes sciencey information, which can be dense at times, and utilizes infographics, a natural tone, and connected hierarchy for an informative, clear, and practical read, that may apply to readers’ lives and benefit their quality of sleep.
Current Problem
Research on health, and research in general, may take more time to understand and fully read than most people are willing to give to the enterprise. The time, technical terms, and effort to understand the article or paper may create a cognitive overload of information, where readers are more focused on piecing together the writing rather than on understanding the message. Because the effort it takes to read the science may override the enjoyment of learning something new, people may disengage from the content. This ultimately limits how often people search for information on health and how people may be able to relate to and connect useful information to their lives, when awake or asleep.
Envisioned Goal
The purpose is to communicate science on sleep in a creative but succinct way so that it has the potential to be effective in people’s lives.
With this, the focus is on emphasizing important and relevant information but translating it in an absorbable and informative way, so that content is more enjoyable, more interactive, and more likely to be remembered. This way, people will be informed about science, while having the ability to apply it to their lives. It is accessible for every type of reader.
The goal is to clearly present the message, about sleep processes and benefits, with the least amount of cognitive effort, so that people will be able to learn about health, possibly feel bemused, and choose to actively apply the content to their different lifestyles. They will be able to share their knowledge, interesting insights, and new opinions with other people as well.
Keywords & Phrases
Sleep, Cycles, Waves, REM, NREM, Sleep Benefits, Sleep Stages, Recommended Hours, Koalas, Rest
Science Translation Problem and Accessibility of Science → Application to People’s Lives.
Problem and Goal Frontload.
Project Objectives.
Bring together a proto-persona’s key points, visual design elements, and visual and written content for a learnable read that packs a friendly punch.
01 . . . . . . . . . . . . . . . . . . . . . . . . . UX Design
02 . . . . . . . . . . . . . . . . . . . . . . Visual Design
03 . . . . . . Communication Translation
01 UX Design
Define Research Topics + Synthesize Findings + Connect the Pieces + Plan for Visuals
The Design Focus
◈ Find and Select relevant research.
◈ Utilize infographics, imagery, and other visuals to share the information.
◈ Draft a plan for the visual concepts based on how people learn content.
To define what sleep topics to highlight and present to people, an initial research phase determined the variety of topics being shared online and what themes appeared more often than other themes. With a mix of online content readily available, select topics were chosen for an elliptical newsletter read. Based on the research, some more common and repetitive, and some less frequent but fascinating, the visual plan was loosely drafted, so that it has the ability to be adjusted for this project journey.
02 Visual Design
Select a visual theme, with an emphasis on colors, layout, and hierarchy.
The Design Focus
◈ Tone of voice and text choice, with titles like “Benefits,” and “How to.”
◈ Hierarchy, with space to take in, process, and connect content.
◈ Color choice, to highlight key areas and pair images and text together.
Visual information portrays a message and connects various topics together through the order it presents content, it’s hierarchy, and the way it is pieced together, it’s layout. The overarching theme of sleep is meant to provide restful content to readers, so colors and fonts were chosen to represent this naturally occurring process. The layout and hierarchy connect this theme and related sleep topics and other themes utilize visuals and text, which combine for a salient message and reader experience.
03 Communication Translation
To the point text + related imagery + engaging and conversational tone + mood match
The Design Focus
◈ Tone of voice, that is relatable, understandable, and clear.
◈ Passive to active learning, with content taken off the page and into life.
◈ Related visuals, with text and images interspersed throughout the read.
A conversational tone provides clarity and fluency for the reader to relate to the material and opportunity to interact with the message. For this read, interacting is looking at the visuals, taking time to process the content, and referring to it later, rather than disengaging by briefly scanning the material and leaving the email page. If it is relevant, piques their interest, and indicates how it may benefit them, the message may anchor with individual understanding and be applied with intrigue, curiosity, and engagement.
Sleep Content & Research Pivot
Prioritizing what sleep information to share and what topics work together for a substantial, focused, and interactive read.
Sleep Questions ⸾ Selection ⸾ Pivot ⸾ Redirection ⸾ Message
During the investigation of sleep topics, I ended up with content that ranged from sleep stages to sleep benefits, to what makes you fall asleep. The more I searched, the more I realized how much content was out there. I originally thought I would just write about sleep, but I didn’t realize how much breadth that encompassed. With this continuing expanse of content, I decided too much information with a broad focus might actually cause readers to be distracted while
narrowing in on themes would focus the content and provide more depth for readers to process. Additionally, the assorted but related topics are a place for readers to view in more detail and move through their own reading tangents in their own time and at their own pace. So, I collated information that seemed like it would connect by presenting similar and relevant writing with a smattering of diverse learning topics for readers. This variety and overlap of content would connect themes and fortify the sleep science message. From this preliminary research phase, 5 themes were identified.
Narrow in on 5 Main Themes
The themes are landing points for people to take in content and learn about sleep pathways. These are the chosen sleep themes from initial research.
Benefits
How to Fall Asleep
Brain
Sleep Stages
Cycles
Impact of Sleep on the Body
Ways to Improve Sleep Patterns
Defining the Sleep Process
How much Sleep is Best for Various Ages
Sleep Cycles Around Us
With a general population of people, who are the users of this read, the benefits of sleep and how sleep interacts with the body appear most applicable. Specific explanations on the sleep process, quantity, and cycles are places to jump in to learn more details, with interesting facts interspersed through the writing and visuals.
Sleep themes + their pathways
Users
People who need sleep, people who would interact with an online article on health, people who are normalized to the speed of the tech world.
Parent → Employee → Graduate → Aunt → Sister
With people sleeping for 1/3 of their lives, link, and with fewer than 1% of people needing less than 6 hours of sleep a night, link, the user focus is able to be generalized to most people. For the purpose of the email newsletter, the user group also consists of people who have access to email and are used to technology in their lives.
Protopersona ~ Abigail
Abigail is a city resident who commutes by train to work every day. She has her day job and her after work hobbies, which she takes time to work on in the early evenings at the local rock climbing gym and the pop-up exhibits around the art’s district. Abigail doesn’t have much time to read since most of her day she completes and learns software languages, and she relaxes with friends during her off hours. While she doesn’t get much time for extracurricular reading, since she likes to use her time for other activities, she does enjoy learning new information, especially if it has a good twist.
Behaviors
She catches up on business, news, and emails during her commute to work.
She shares links, screenshots, and interesting articles to her friend and family group chats via her phone.
She isn’t too concerned about sleep since she sleeps when she has the time. However, she wouldn’t mind learning other ways to rest and get energized for her day.
Abigail needs a seamless newsletter read that synthesizes relevant health information with visuals and easy to read text so that she can learn something new, incorporate it in her day, and feel like she gained something by reading or scanning, versus losing time and expending extraneous effort when processing the email sleep message.
Hypothesis
A read with modern design choices will work to capture readers’ attention and motivate them to understand the content. Infographics and a short read time will keep readers engaged because they will use a small amount of time to learn multiple facts.
Insights
Everyone needs to sleep; A read with modern graphics and concise information will work with readers’ lifestyles and processing styles.
HMW
HMW piece together the read and communicate its message?
HMW give context and saliency to how the message is learned?
HMW locate key information and share it in 1 place?
Goal
Create a sleep letter with modern infographics, a natural speaking tone, and concise text for a science article that is thought of differently and processed differently as well. Readers will engage with content that matches their way of life and ideal processing situation.
Strategy
Implement select design choices, with color, layout, and hierarchy, to translate science into influential and understandable content.
~ Problem Statement ~
Most People Universally
Frustrations
How does she make the most of her day with a mix of work, social, and family events?
She receives constant spam emails with promotions, online advertisements, and commercial news. If she reads email articles, she will glance at titles and images.
When she reads health articles, 1 topic might take up multiple pages. This is exhausting to read and process in a sitting.
Assumptions
She is immersed within the modern technological world and has easy access to smart technology.
Her inbox is constantly spammed with various random email promotions.
Constraints
Because she has a mix of priorities, with her work, social life, and hobbies, she also has limited time to give for extraneous tasks, even if they may benefit her health.
Needs + Goals
She needs emails to clearly state what they are sharing and to make things simple regarding clicking and scrolling through page content.
She needs short read times with a mix of facts consolidated together, so that she has something light to read while she gets ready for the hustle and bustle of her work day.
She wants to be able to learn something without overwhelming her morning cognitive abilities . . . it’s still early and she needs coffee.
+ + + Energy
CONTENT COPY: “Keep the body’s defenses strong & capable. During rest, you create protective antibodies, which combat illness. You also build up your energy, so you can fight bugs and stay healthy.”
⬆ Social & Emotional Skills
Intention and Why: It is more common to learn that sleep influences people’s ability to feel equipped for their day. It is less commonly shared that sleep relates to emotions and social skills. This was an unusual but cool fact for people to learn.
Benefits + Sleep in the Body
Intention and Why: With people looking to prevent illness and combat its effects when they get a cold, it seems prevalent to start with how sleep influences the immune system’s ability to fight different bugs.
Stronger Immune System
Intention and Why: During research, the concept of sleep satisfaction was explained, where people may sleep a lot but have poor satisfaction and vice versa. So, I wanted to share how well a person sleeps relates to their well-being.
CONTENT COPY: Sleep quality, quantity, and satisfaction impact how energized you feel for the day. Increased sleep satisfaction = stronger feelings of energy and positive emotions.
CONTENT COPY: When you are well rested, you are better able to recognize emotions in other people. Getting good sleep sustains your emotional empathy, so get some rest and emote!
Intention and Why: The benefits of sleep start the article, so that readers are hooked into learning how getting sleep may improve the quality of how they function during their day.
CONTENT COPY:
+ Lower rates of ♡ disease
+ Prevent depression
+ Lower Inflammation
+ Greater physical output
+ Increased concentration
How To Fall Asleep
Intention and Why: After beginning with sleep benefits and describing a few in detail, sharing how to sleep better wrapped up the section and connected benefits to action.
CONTENT COPY:
+ Less noise
+ Cooler temperatures
+ Consistent time for bed
+ Get a good pillow
+ Be active during the day
Email Design Process, Piecing it Together
People’s Sleep Stages
What happens during the sleep process. With people’s different lifestyles and their work, family, and extracurricular activities, what happens physiologically is pretty consistent across individuals.
CONTENT COPY:
The Brain and Defining the Sleep Process
Rapid Eye Movement (REM) in the sleep process
REM | The phase of sleep where most dreams take place. During REM, brain activity, heart rate, breathing, and blood pressure increase. The body becomes immobile and the eyes rapidly move while closed. Link
Non-rapid Eye Movement in the sleep process
NREM | The phases of sleep that are dreamless and most frequent. During NREM, breathing and heart rate slow down and become more regular, blood pressure lowers, the body is relatively still, and it is difficult to wake up. This process happens during 3 out of the 4 stages of sleep and the last 2 Non-REM sleep stages encapsulate the deepest sleep. Link
Falling asleep between 8pm - 12am gives you the best opportunity to move through your sleep cycle. The early and late hours of the night sync up with shifts in sleep patterns. So, you’ll have a better ratio of restorative and dream sleep stages before midnight. The brain moves through different wave patterns, and during this rest, memories are created and healing occurs.
Intention and Why: Describing what happens when people sleep seems like a main area that people would want to learn about regarding sleep. With a newsletter on sleep, learning what it is and its mechanisms is a main message to be shared after the benefit’s of sleep section .
REM + NREM IN SLEEP
Sleep is characterized by eye movements that indicate what stage of sleep people are in, whether or not they are dreaming, and what physiological changes may be occurring.
What characterizes REM and NREM are the eye movements that occur during these processes. REM sleep, with frequent eye movements, occurs only in the last stage of sleep, where people dream. NREM sleep, with relaxed eyes, is a dreamless sleep that occurs in 3 of the 4 stages of sleep. Different brain waves and physiological states happen in each sleep stage.
3 Themes Revisited
Visual Design
UX Design
Science Reframe
4 Sleep Stages, Infographic # 1
Visuals and text combine for a (coherent) take on the sleep stages and their details.
Non-rapid eye movement (NREM) and rapid eye movement (REM) characterize your 4 sleep stages. The stages determine how you relax, rest, and dream. A cycle of sleep through these stages takes 1.5 - 2 hours.
Note: Interestingly, people move through the 4 stages of sleep in a different sequence than 1, 2, 3, 4. People progress into stage 1, 2, 3 then return to stage 2 before REM.
Science Visuals
CONTENT COPY:
Intention and Why: Showcasing an infographic on the 4 stages of sleep, it paired well to bring in REM + NREM sleep, which are main points of the sleep process that are shared in online articles and research. The 4 stages are the various ways in which people move through sleep and the time and sequence of the stages add to the infographic, which identifies the type of eye movements, time in the first cycle, percent of a full night’s sleep, a few physiological changes, and brain waves that occur in the sleep stage.
Sleep Infographic 2, Time Graph
Full Night’s Sleep
CONTENT COPY:
Intention/ Why: List how much sleep is recommended for different age groups simply and in partnership with the doughnut graph, which shows how long overall you would be in each stage during sleep.
Toddlers: 11 - 14 hours
Children: 9-11 hours
Teenagers: 8-10 hours
(Young) Adults: 7-9 hours
Well-Aged: 7-8 hours
Use a 2nd infographic to relay information about the stages total duration, which connects to the 1st infographic’s 4 stages of sleep breakdown but with a focus on 1 cycle.
The second graph had enough information related to it that it could be contained in it’s own infographic and its own section. While this section stands on its own it also links with the 4 sleep stages, since it captures the total amount of time that a person
Stage 1
NREM
2- 5%
Stage 2
NREM
45-55%
Stage 3
NREM
15-20%
Stage 4
REM
20-25%
moves through the 4 stages at night. While the 1st infographic indicates the time in 1 cycle of sleep, the 2nd infographic indicates the estimated time a person would spend throughout a full day or night’s sleep, of 7-9 hours, for an adult, where a person would average 3-4 total cycles through the stages of sleep, Link. Additionally, this graph intends to show the overall %, where each cycle would vary slightly in duration for each person. The text pairs with the visual image by indicating how much sleep people should get depending on their development and age. The section contains 2 parts with information on “How often you are in each stage” of sleep throughout the night and “recommended sleep,” where the total amount of sleep connects to how that changes over a person’s lifespan.
% in Each Stage
With a general population of people, who are the users of this read, the benefits of sleep and how sleep interacts with the body appear most applicable. Specific explanations on the sleep process, the cycles, and quantity of sleep are places to jump in to learn details on sleep with interesting facts.
Specific explanations on the sleep process, the cycles, and quantity of sleep are places to jump in to learn details on sleep with interesting facts interspersed throughout the writing and in the.
A mix of colors, layout, and graphics add, provide another dimension. With interesting facts interspersed throughout the writing and in the visuals to draw readers into other cool places.
Layout
Visual & Text Choices
Color
Lorem ipsum colors and design choices
Hierarchy
Specific explanations on the sleep process, the cycles, and quantity of sleep are places to jump in to learn details on sleep with interesting facts interspersed throughout the.
. . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . .
Tone of Voice
Lorem Ipsum Dolores, Lorem Ipsum Dolores, Lorem Ipsum Dolores, Lorem Ipsum Dolores, Lorem Ipsum Dolores
Text Choice
Lorem Ipsum Dolores, Lorem Ipsum Dolores, Lorem Ipsum Dolores, Lorem Ipsum Dolores, Lorem Ipsum Dolores
Sleep + Recharge Concept to Newsletter, but for email!
Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum.
Write here . . .
Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum.
Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum.
Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum, Lorem Ipsum.
Resources, Links, & Articles
“A sleep cycle lasts on average of 1.5 - 2 hours, so sleeping 7.5 hours is equal to around 4 to 6 cycles of sleep.”
◈ Sleep Cycle ◈
Active Brain During Sleep
“Some parts of the brain use more oxygen and glucose while asleep than when awake. We used to think that everything shuts down when we sleep, but scientists have discovered that our brains are active in sleep.”
Lorem Ipsum
“People will on average spend 10 seconds reading a brand email.”
24 - Hour Cycles
Changing Sleep Patterns
Lorem Ipsum
“You have a master clock in your brain that is influenced by the light and dark of a 24-hour day. The circadian rhythm, from “circa diem” (around a day), signals your sleep.”
“The first 3 hours of sleep have the deepest stages of sleep (Slow wave sleep). Later in the night, people have more vivid dreams, in REM sleep.”
“A cool fact here about sleep that is listed out and easy for people to read.”
Washing Machine Cycles
Lack of Sleep and Focus
Lorem Ipsum
“During sleep, your brain is washed with cerebrospinal fluid, like a washing machine on cycle. This process helps to clean out toxins and refresh it.”
“Everyone who is has a lack of sleep loses concentration and experiences mood changes.”
“A cool fact here about sleep that is listed out and easy for people to read.”
Cycles, Fun Facts
Other Sleep Facts
Learning + Tech
. . . . . Link . . . . .
. . . . . Link . . . . .
. . . . . Link . . . . .
. . . . . Link . . . . .
. . . . . Link . . . . .
. . . . . Link . . . . .
. . . . . Link . . . . .
. . . . . Link . . . . .
. . . . . Link . . . . .
◈
People remember around 80% of what they see versus 10% of what they hear and 20% of what they read. (Link)
Resources
With a mix of online articles and a few publications, there was a place to share the resources at the bottom of the newsletter. This way people would be able to read more if they have the time and would want to look into the topics more. While key points were pulled out of the resources and into the newsletter, people still might want to take their own dive into the research to learn more about sleep.
People process images 60,000 x’s faster than written or typed text. (Link)
Reflection
The article itself seemed like a fun idea after graduating from the GA course. We were encouraged to complete a passion project and this was 1 of the one’s I was interested in working on. With an interest in health, and a better understanding of design, I could combine the skills from the classes into a read surrounding a topic I thought would apply to most people and be beneficial to know about for most people as well.
Additionally, while putting the case study together, I realized that some of the grammar and spelling could be edited, so I went ahead with that for the iterative process through the case study explanation.
Next Steps
Realistically, the energy it took to complete the newsletter took more time and organizing then I had accounted for. I think with a better workflow, the creation part of the newsletter could be faster.
Additionally, I didn’t complete user testing for the project. With a generalization to most people, since everyone has to sleep, the newsletter drew from a protopersona for key insights and a design workflow. Keeping with the goal of having people engage with the read and using minimal time with maximum usability, in terms of processing the content, it seemed user-friendly to forego the usability testing and group surveys for a newsletter read without the technical feedback. Having technical feedback through before and after surveys could create a negative user feedback where the read feels more like a long process, scientific project, spam survey promotion versus a casual read that could be interesting and fun.
and the benefits of the material to their lives. speaking conversationally, people could feel relaxed enough to listen, absorb, and assimilate content (piece together). to encourage learning with the overall message with related topics . . .The idea here is that it can be cooler and more “presient, focal, notable, noteworthy, salient,” to know the benefits of why you are doing something or how it works, or interesting facts about it. I think it makes it more relatable and exciting . . . maybe, you’ll also want to give it a try (Try it out more) too! if it seems relevant, piques their interest, and clearly indicates how it may benefit them. With the text and imagery being placed in ways (wc) that intend to strengthen the learning process, - with/ through images - which gives, provides, anchors and visual understanding to the content - speaking with the text (in conjunction) which gives context to the images, people will be able to connect to the message and apply the learning to / in how they sleep.
HMW give context and saliency to the message so that it could be learned and assimilated well, and retrieved for actual use in their lives.
where sleep occurs universally and in tandem with the light of the day.
Reflection
