TST Phase 4 Artist Collaboration Website
Coming Soon
The Serious Type
Artist Collaboration Website, Phase 4
Purpose:
An organization that brings artists and creators together for collaborative projects.
Client Team
Founder (artist/teacher)
Client Consultant
Tools
Figma
FigJam
Notion
Slack
Google Docs
Rooted in art education and environmental sustainability
Connect artists and other creatives who share the same passion
Collaborate on projects, inspire and uplift one another
Timeline
8 weeks, Agile
My Role
Content Strategist & UX Writer on a cross-functional, remote team
UX Team(23)
Content Strategy/UX Writing(4)
UX Design(6)
UX Research(5)
Product Strategy(4)
Development(4)
Project
An online web platform to bring creatives together for collaborative work.
A virtual space to contribute to creative work with a common mission, while learning, teaching, and inspiring one another.
Users and Audience
Artists (professional and amateur) and other creatives, writers, educators and volunteers
Ages: 30-50 (pivot from earlier phases as a teen social media platform)
Focus of Phase 4
research how/why creatives decide to join TST
share work as a “project” and find collaborators
My Team: Content Strategy/UX Writing
Challenges & Constraints
Conduct research and design simultaneously for this new type of platform
Short timeline: (8) one-week sprints with weekly client demos
Must keep the existing product name
Unclear branding and target audience
Initially, I worked with 1 lead and 2 other members
As the weeks went on, two team members were pulled onto other projects, so my contribution increased.
Content team worked mostly asynchronously.
Content team coordinated with other teams through Slack, virtual meetings and remote work sessions.
My Responsibilities:
Competitive Analysis
Content Audit
Information Architecture
Content Style Guide
Brand development
color palette selection
typography
tagline
Copy for menus, headers, and sub-headers, buttons
Long form copy as needed
Frequent review of screens/flows in Figma
Cross-functional demo preparation
Represent Content team at client demo as needed
Represent Content team at daily stand-ups and other teams’ work sessions
onboarding flow
Weekly Schedule: Content Team
(avg. 20 hrs/week)
Monday - Friday Stand Up (1 Rep from each Team)
Monday
Work session (Design + Content + Research + Product)
Sprint retro/Sprint planning (All teams)
Tuesday
Work session (Content)
Wednesday
Work session (Content)
Work session (Design + Content if available)
Thursday
Work session Work (Design + Content + Research)
Asynchronous Demo prep (All teams)
Friday
Client Demo
Quick de-brief
Here’s a peek at when our Content team’s actual tasks took place during this 8-week sprint:
-
Competitive analysis
Concept testing
-
Content Audit
Draft Site Map (Content)
Review concept testing results from Research
Extract “Jobs to be Done” from concept test results (All teams)
Review experience (journey) maps from Research
Prioritize user flow(s) for Phase 4
Review Design team’s wireframe sketches
-
Review user flows from Design
Prioritize “How Might We” questions (All teams)
Review low-fi wireframes from Design
Voice/Tone brainstorming
Lexicon decisions
-
Outline Content Style Guide
Provide content strategy for Design for low-fi wireframes, flows, navigation, scenarios
Asynch review/feedback for onboarding screens, Landing page, navigation, and Gallery page
Continue cross-functional team meetings with Design and Research teams
Review Design System from Design team
Dev team recommends and begins training on a low code platform
-
Continue lexicon decisions
Create word list for Content Style Guide
Preliminary research indicates pain points with some vocabulary terms
Use word list, voice characteristics, and preliminary research findings to inform content for the Landing page and the About page
Share first draft of Content Style Guide with all teamsDiscuss Site Map with Design team: move some items to 2nd level navigation
Feedback to Design team for onboarding and finding a collaborator flows
Client surprises us during demo, so Product team advises scope adjustment
-
Typography specs to Design and Dev teams for Design System
Write microcopy
Site map alignment across teams
Begin color directions with Design team
Prioritize task flows for user testing
-
Content for About page to Design
Feedback to Design for hi-fi wireframes
Feedback to Design for color palettes
Content Style Guide revisions
Coordinate with Design for Coming Soon page content
Cross-functional prep and presentation to client: user flow and 2 color palettes
Research team conducts usability tests
-
Review results from moderated usability testing
Incorporate research results into screens and microcopy
Finalize Content Style Guide
Finalize site map
Research runs unmoderated usability tests, all teams review results
Continued feedback for design iteration
Cross-functional prep for final demo showing project journey and prototype
Final client demo
All team retro, wrap up
Discovery Research
Prior to kickoff, I reviewed the previous phases.
Two team members had been on the previous phase of this project.
I asked them specific questions about the reason for the target user group pivot, and to learn more about this client.
Competitive Analysis
All teams worked cross-functionally to evaluate a list of over 50 potential competitors and identify the most relevant.
Content Audit of Existing Website
All members of my content team completed this, then compared notes.
The existing site had functioned quite differently than what the client had in mind for this project.
A definite lack of branding
No clear information architecture in the existing website
Disconnect between the organization name and mission
How might we…?
encourage creatives to share their work
create a sense of trust and professionalism
efficiently connect people for ongoing projects
Our overall goals were to inform users and allow them some control
Communicate TST’s mission, professional expectations, and options quickly and effectively through proper navigation and page content.
Include privacy control for project owners
Focus on the onboarding flow
Usability Testing Results (First Round)
This inspired me to do a quick IA sketch which the team used in the next client demo.
Initial phase 4 site map
Concept Testing: User Interview Insights
Advocating for Content Strategy / UX Writing
From the beginning of the project, there was a tendency (and a deadline) for the Design team to dive into creating before we were in agreement across all teams.
Our team lead was instrumental in advocating for the Content Strategy team to be an active part of all cross-functional meetings with Design and Research.
This helped streamline efforts, and kept the content consistent and on-brand.
Existing TST website screens
By week 2, the client had described to us how they thought this website might function, and what they wanted to include.
Although the Design team was already creating wireframes and user flows…
I knew we needed to better define the Information Architecture.
Users typically share their work to connect with other creatives
”It’s nothing about money or recognition, it’s more about ‘wow I love this so I’m sure someone else would love this too.’”
Users value feedback about their work from trusted sources
”I have a number of people in…my immediate community who I’ll always vet things with…just to see…how work is progressing.”
One of our strengths as a large UX team was our excellent and inclusive communication via Slack.
We added a channel for cross-functional team communication and often invited others to cross-functional live work sessions within Figma. This was my favorite way to work.
Information Architecture (IA)
Users find that sharing their work can be vulnerable
”I think a challenge can be feeling like… is this even good enough to share?”
content team items included lexicon choices, content structure, and navigation
unclear names for several features and sections
use of hashtags from previous phases now less relevant
incorporate levels of access and privacy protections for projects
Define the Problem / Align the Team
The teams worked to understand and integrate this client’s vision for the 4 main parts of this website’s ecosystem:
Use a graphic here
Studio
Gallery
Experiences
Salon
Challenges: Pivot quickly & work with ambiguity
We needed to prioritize the focus for this phase, pivoting in several ways from previous phases. We had to fill in the blanks when the client was unsure.
For example, the client seemed to be unsure of the target audience. We had to choose an age demographic to perform the concept testing. We used the results from concept testing supported this choice of age demographic. This in turn helped us begin to develop a brand direction.
Graphic here
Content Strategy
paragraph for context
Content Style Guide
might not need this section
Prioritizing User Flows
prioritizing flows for user testing
Information Architecture
Paragraph about how the IA evolved
word list
lexicon
Extracting “How might we” statements
Design
paragraph for context
Brand Development: Typography
placeholder paragraph p1
About Page
Content Strategy, UX Writing, and Design
placeholder paragraph p1
UX Writing
microcopy examples
Content Strategy: Integrating Research Results
Concept testing results
Usability testing results
Iterations: Providing Feedback
placeholder paragraph p1
Brand Development: Color
High Fidelity and Prototype
Images of hi-fi screen flows
Placeholder paragraph
As the project laskjdflkasldkfjalsdkfjl
Final Client Demo
All teams took turns presenting:
The “story” of this sprint
All teams worked closely on this cross-functional presentation, laying out the “story” of this phase, including the reasons behind processes and decisions.
Research insights
How research influenced design
Updates made after rounds of user testing
How specific changes in language, color, and interactive elements solve problems indicated by research
++++++ Image here
2. Prototype walk-through
Design team walked through the entire prototype showing:
Landing page - learning about TST
Learning about the 4 parts of this website
Entering a members only area, and getting a little preview of what they could find there, then a pop-up CTA for signing up
Sign up/onboarding
Creating a new project, indicating it’s a private project with the option to open it up to collaboration
Adding a collaborator to a project
Posting an update to a project
3. Conclusion
Development team addressed questions about the hosting platform. They reported that the platform they recommended involved minimal coding, and the plugins would be able to handle the database and (future) messaging functions.
Product team spoke about the vision and future of this product, explaining that this product is the first step. In the future TST may choose to branch out with youth-centered mentorship or other functions.
Content concluded the presentation with a list of short-term action items that would be quick wins for TST as they launched this site, and would have the greatest immediate benefits.
Throughout this project, the TST project team learned what users likely want, need and prefer. We learned what obstacles may exist – particularly with learning and understanding the TST offerings, onboarding, navigating, and sharing work.
“I love everything you presented today and saw how it all came together...Overall I think you brought great value to this segment of The Serious Type.”
Landing page showing the 4 parts of this website
“I want to take a moment to recognize [the Content team] for how much work you both did during the final sprints. You both accomplished so much in that short period amidst your individual schedules... I really love how the content style guide turned out, and the about us page.”
“You left us a really great container and direction to love forward with.”
Takeaways / Retrospective
What went well
a
b
c
What I learned
a
b
c
What didn’t work
a
b
c
add image credits, hi-fi images or gifs