Designing a virtual membership for Betaworks Studios

 

Betaworks Studios’ Meatpacking District clubhouse is a place for tech builders to meet, collaborate, learn, and grow. This project seeks to expand the studio’s reach and bring the experience to a broader audience through a new virtual membership program. My V1 design showcases interactive live events and includes calendars, purchase flows, onboarding, and account management features.

 
Group 29.png

My Role:

Lead Designer (UX / UI / Strategy)

Scope of Work:

  • strategy phase with leadership + product teams defining project goals and scope

  • site map

  • user stories

  • user flows

  • wireframes

  • copywriting

  • visual identity

  • mock ups  

  • prototypes

 

Defining a product strategy

We kicked off the project working with our CEO, COO, marketing, and product teams to build a vision for what our virtual membership could be. Although the long-term goal is to provide a service that fully captures the benefits of Studios membership, a business decision was made to focus on our events for the initial launch. Our V1 product will combine a broadcast of our in-house events with interactive Q+A’s, polls, and discussion threads.

I conducted research on our current programs, members, and comparable services to understand where we could create real value for our users. I then went on to lay out possible membership models and worked with the larger team to understand the technical and business feasibility of each option as we structured our final plan.

I explored the implications of placing the paywall at different points in the flow and introducing or removing plan options. I also raised and examined questions such as - are users applying for memberships or purchasing them?

 
groundwork.png
 

Creating the foundations

I then went on to write user stories, lay out a site map, and set up wireframes to establish the skeleton of our project and outline the requirements of each element.

Skeleton.png
 

Developing a visual identity

I worked with Christian Rocha, Betaworks’ Creative Director, to create the visual identity and editorial voice for the virtual membership platform. Like the imagery Christian produces for our events, things are polished, but fun, irreverent, and a little bit off. A mix of bold fonts and bright colors are combined in unexpected ways to capture that ethos. I’m working to finesse the colors for accessibility and to channel the initial creative explorations into a consistent system we can build upon.

visual design.png
 

Designing an event experience

The event lies at the heart of our V1 product and special care was put into creating a space that not only showcases our content, but also provides avenues for attendees both virtual and IRL to meet and connect. Our research showed that opportunities to network were as valuable to our members as the enrichment from the events themselves. I sought to understand the natural flow of interactions at our in-house events and to build that cadence into our virtual experience.

We wanted to marry the in-house and online experiences as much as possible and also began exploring ways in which the presence and participation of virtual attendees could be expressed in the studio itself.

Group 3.png

The theater will open at the same time as the doors open in the studio. As participants wait for the show to begin they can watch attendees stream in, learn more about the event and speakers, and make small talk with with those around.

During the event, the house lights go down and the theater enters dark mode. The broadcast expands to give you a better view, but shares prominence with the interactive features including emotes, chats, and Q+A.

After everything’s over the lights come up and the event information takes center stage once more.

Group 4.png
 

Building a profile

Our current members find tremendous value in the network of peers they have at Studios. We therefore wanted to ensure that everyone would have a chance to connect and continue conversations outside of the event space. I created profile cards based off of our current member profiles and added in links to social accounts and personal websites to facilitate that.

Desktop.png

I also designed the profile building experience to integrate with our theater in order to make it easy for all members to complete them.

Group 5.png
 

Next steps

With a strong foundation in place we’re refining the visual design, exploring edge cases, and coordinating across screen sizes.

Group 30.png