Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
Compare two mattress websites with different brand personalities and create UX content for a new product page.
Project instructions:
- PART 1: Go to the websites for Avocado and Sealy, explore the websites, and fill out a brand personality for each. Note: there is an Adobe XD template in the Project Files.
- PART 2: Open the Adobe XD files for Avocado and Sealy. If you prefer another design tool, feel free to use it. Fill in the product description pages with UX content. Use the text, images, components, and layout as a starting point and take creative liberties wherever you'd like! The goal is to create UX content that aligns with the brand personality to sell a new type of mattress.
- BONUS (optional): For each brand, fill in the contact page with UX content.
Free stock photo sites:
Reference:
- Personality trait exercise guide Pro tip: Download the Project Files for a handy Adobe XD template.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[MUSIC]
0:00
Hi, I'm Hope Armstrong, and I'm a senior
product designer and teacher at Treehouse.
0:09
My pronouns are she/her.
0:15
In this practice session,
we'll be creating UX content for
0:18
two mattress companies,
Avocado and Sealy.
0:22
Avocado makes eco-conscious mattresses
from non-toxic and organic materials.
0:25
Their website goes in-depth to describe
the brand's sustainability goals and
0:32
environmental impact.
0:37
The content is transparent, and
0:39
they go to great lengths to describe
the carefully chosen materials.
0:41
The blog provides even more environmental
insights for their audience.
0:46
Sealy is a conventional mattress company
that has been in business since 1881.
0:51
The content emphasizes trust,
affordability, and convenience.
0:57
From looking at their
product descriptions,
1:02
they're proud of the technical
innovations they've made over the years.
1:05
While both of these companies
are in the mattress business,
1:10
they have quite different
brand personalities.
1:14
For the first part of this practice,
articulate
1:17
each company's brand personality using
the template found in the project files.
1:20
You will want to browse both companies
websites to get a sense of their style.
1:24
Once you have articulated
the brand personalities,
1:30
the next phase is to craft the UX
content for a product page.
1:34
For Avocado,
you'll be creating a product page for
1:38
a new mattress called the Avocado Cloud.
1:42
For Sealy,
1:45
you'll be doing the same thing except
the product is called the Sealy Infinity.
1:46
In the project files,
there is an Adobe XD file for each brand.
1:52
I've loaded it with a basic page
layout and various components.
1:57
I've also included product details.
2:02
Use this as a starting point, and
2:05
rework the copywriting to
match the brand personality.
2:07
As for the images,
they are from each company's website.
2:11
If you'd prefer to use stock photos, there
are resources and the Teacher's Notes.
2:15
Since the companies use fonts
that are not available for free,
2:20
I'm simply using Verdana because it's
pre-installed on many computers.
2:25
Feel free to change
the font if you'd like.
2:30
This template will help you quickly
work within the brand style
2:33
while focusing on the UX content.
2:37
Create descriptive,
helpful, inspirational, and
2:40
transparent content that aligns
with the brand's personality.
2:43
It can be purely text or it can
include images, interactive elements,
2:48
and any other ideas you have
to show off the new mattress.
2:53
As a bonus, if you'd like to complete
another page, try creating a contact page.
2:57
I included a contact page
with example text, so
3:03
you can use it as a starting point.
3:06
If you can't complete both pages,
no worries, just do the product page.
3:08
As a reminder, these mockups are for
practice purposes only.
3:14
The images and branding are property
of the companies mentioned.
3:19
So don't include these
mockups in your portfolio.
3:23
All right, that covers the project,
have fun with it, and
3:26
I'll catch up with you
when you have finished.
3:30
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up