design studio.png

Foglifter

 
Foglifter design studio.png
 

Foglifter Journal

LGBTQ literary journal for emerging writers based in San Francisco

Scope: A two person team on a three-week design sprint

Work: Brand research & strategy, participatory design, content strategy

 

Problem

The original request was for a website redesign in preparation for a spot on the national literary stage. The real problem was lack of alignment about the Foglifter audience. 

 

Method

We understood this as an organizational development project first, and a website redesign second. We focused on understanding the brand voice and tone and equipping Foglifter to move forward with a single vision. 

 

 

Solution

In three weeks we produced a content strategy, brand and style guide, content posting calendar and archetype profile set to capture Foglifter's understanding of its brand. This was supplemented with annotated wireframes and a step-by-step guide for working with a website developer. 

 

Impact

Foglifter now has internal alignment about its brand identity and audience and the tools it needs to communicate this vision on the national stage. 

Role

My research partner and I shared equal responsibility for each major decision during this three-week project. 

Areas where I took a primary role include background research, competitive analysis, developing survey questions and evaluating the results, planning the participatory design session and creating the content strategy. We each drafted prototypes for the website redesign and jointly interated prior to the final selection.


Building our understanding

Our initial interviews suggested divergent views about mindset, pain points, and future growth across the organization. 

 

 
 
 
 

As we interviewed more staff members the multiplicity of views became even more obvious. There was not agreement about the audience of Foglifter's work, and readers were rare mentioned during our interviews. This led us to suggest a participatory-design process  to help draw out the specifics of Foglifter's brand identity.

 
Why care about foglifter.png
Screen Shot 2018-04-09 at 11.39.13 PM.png
 
 

Getting the problem right

During the participatory-design session Foglifter staff responded to mood boards after ranking the most compelling images. This prepared them to talk about their brand identity in detail.

 
 
 
 
 
 
 

The conversation about brand identity led to an ideation session about audience. The ideas Foglifter staff shared became the foundation for the archetypes delivered in the final product. 

Personas by foglifter.png
Foglifter design studio 2.png
 
Screen Shot 2018-03-29 at 9.25.13 PM.png
Community member.png
Screen Shot 2018-03-29 at 9.25.29 PM.png
 

After completing the Foglifter staff interviews we identified the stakeholders as: 

  • Foglifter staff

  • Writers submitting work

  • Authors Foglifter publishes

  • Readers

  • Event participants

We used these categories to hypothesize about the features and functions Foglifter would prioritize for an MVP during the particpartory design workshop.

 

And then we tested our MVP hypothesis during the participatory-design session.

feature prioritization 1.png
 

Foglifter staff members confirmed that user satisfaction was important. Purchases were less important to Foglifter than we anticipated and social media was more important. Based on this input we believed that ease of use and building community connections were most important. This reinforced our overall sense of urgency related to clarifying brand identity and audience.

Screen Shot 2018-04-11 at 1.08.47 AM.png
 
MVP foglifter - must.png
MVP - foglifter - should.png
 

Getting to solutions

After the participatory-design workshop we drafted two prototypes. The first one emphasied ease of use and social media. This version had IA patterns that were in wide use on the web today.

 
 

The second version focused on ways to bring out the brand and identity of Foglifter.

early feedback 1-2.png
 
A-B test 2.png

With these sketches in hand we then conducted usability testing with paper prototypes, and sought additional user feedback a gallery walk format.

We learned that users found the IA of version 1, above, more usable, but people wanted a cleaner visual design.

 

In version 2, above, users liked the landing page and copy but were unsure about the IA.

 

These results suggested that the two versions had the desired effects, but brought us no closer to presenting Foglifter with a single, actionable solution. Marrying the elements of the two designs proved to be very challenging. To resolve the problem we took a different approach. After iterating the sketches to simplify and clarify, we annotated both designs and asked Foglifter for feedback and preferences.

 

 
 
 

Foglifter preferred version 1. Because Foglifter shyed away from option emphasizing brand voice and tone we were even more firmly committed to providing a cstrategy and action plan for Foglifter. Our thinking was that no matter how their ideas evolved over time having a record and road map on hand would be an essenentail point of reference. 

 
 
home page early draft 1 - 1.png

Version 1: Familiar IA

Homepage early draft 2-1.png

Version 2: Brand voice and tone

 

We then prepared a package of annotated wireframes for Foglifter's website developer. 

 
 
 
02. Home page.png
 

Creating a content strategy

Using all of the information we'd learned about Foglifter up to this point, including keyword suggestions collected in a participant survey, we created a content strategy, brand and style guide, and content posting calendar. Within the content strategy overview we provided a synthesis of the comparative analysis conducted at the start of the project so that Foglifter could identify their location within the literary landscape and make informed choices going forward. 

 
Screen Shot 2018-03-26 at 10.26.59 PM.png
Foglifter comparative analysis.png
 

SEO keyword suggestions

Keyword cloud.png

 

The Brand & Style Guide provided suggestions for key decisions but drew Foglifter's attention to them as choices they should make interally.

Screen Shot 2018-03-29 at 10.10.39 PM.png
 

Delivering the project

During the final deliverables meeting we emphasized what we had learned about Foglifter, how internalizing these points as a guiding strategy would increase the likelihood of their success going forward, and the steps they needed to take in order to be ready to work with a website developer effectively.

 

Foglifter team.png
 
 
Screen Shot 2018-03-30 at 1.36.50 PM.png
Screen Shot 2018-03-30 at 1.50.29 PM.png
 
 
 

Let's talk! maaloumi@gmail.com