MIT Solve

Solve, a new initiative from MIT is a marketplace connecting innovators with resources to solve global challenges–from education and health to energy and inequality. Each year, Solve announces global challenges for which it seeks solutions. Anyone can submit their product ideas for a chance to pitch in front of the MIT community and potential partners for sponsorship at their flagship event, Solve at MIT. When Solve partnered with Atlantic Media Strategies (AMS), they lacked an engaging web presence, a clear challenge cycle process, and content strategy to inspire their community. Our team at AMS helped to tackle these challenges, and I lead the design and creative direction for the project. The solution is a website, a user-generated content platform and an open innovation management system to better serve the community, clarify the challenge process, and effectively communicate the initiative’s purpose and reach.

The challenge

To engage prospective solvers, we needed to get to know the existing ones.

After meeting with the Solve team, we realized that getting to know our existing users could be our roadmap to a better experience for our prospective users. That only by understanding their goals, motivations, and pain points, can we entice prospective users to join the community. This meant interviewing and surveying all the different types of users that make up the Solve community to better understand them. These people included Solvers–those whose solutions have been selected, Solve members, judges, and site administrators. The user research at this stage led us to uncover some key user insights that informed the way we designed the site. The main takeaway for each user category is:

• Solvers had difficulty connecting to the community for support. Specifically, the website lacked a focus on the people that make up the Solve community so it was hard to stay in touch and facilitate knowledge sharing.
• Members needed to more clearly understand Solve, its challenge cycle, and the impact it makes in the world. They want to better understand Solve’s relationship with MIT and the value of that network.
• Judges find that the lack of standardizations in the process leads to unclear communication, making it challenging to efficiently judge submitted solutions. They would like to get to know and collaborate with other judges in advance of the review period.
• Solve Admins experienced inefficient time spent on filtering through inappropriate or low-quality submissions. This was due to unclear submission criteria and standardization of process. In addition, event management and judging assignment do not exist in the current system. Thus, these tasks are manually managed outside of the admin system.

The Process

My role was to conceptualize, design, and help clarify design needs for both the client and our development team. I worked closely with my core team to hold collaboration sessions with clients at appropriate moments, brainstorm solutions, and test for validation. As in previous projects, applying these facets of the process allowed us to speed up the decision-making process and move faster with more comprehensive feedback from the client. I learned to adapt my design process to work half a sprint ahead of development cycle in order to clarify design needs in advance, which helped the dev team estimate better and be more precise in the tasks that needed to be completed in each sprint.

Collaboration session during discovery phase. Photo credit: Zach Kalman

Being able to empathize with our users was invaluable to my process, as it led to tremendous opportunities for design. In order to build a dynamic, user-generated content platform, it was essential that my team and I kept our focus on our users’ needs and goals. To help guide us and ensure our solutions evolved in the right direction, I worked with the team and client to distill our user research insights into design principles. Below are our design principles for this project:

Design Principles

• Keep Solvers and their impact at the center of our work. Empathize with our users so that we can better support and enable the most passionate and driven people to take their solution from concept to reality.
• Sacrifice for simplicity. Simplicity is not just about excluding the bad ideas or unnecessary features. It’s about laser focusing on the things that are most valuable and doing those things exceptionally well.
• Communicate for the right needs. Prioritize the users’ needs, and then focus on communicating clearly to those needs.
• Nurture the community. Grow a fun and inspiring environment where people gain value even when they aren’t selected as a Solve finalist.

Strenthening the visual language

As our development team began to build the infrastructure of the site on Laravel, I worked with our client to clarify our product’s visual language direction. I surveyed the internal stakeholders to gain an understanding of the challenges the team faced with their existing brand identity system. The goal was to uncover what’s working and what’s not and use this opportunity to iterate upon the identity system. Based on the feedback, I improved the visual language to meet our content strategy needs and to better reflect the brand personality that the team agreed upon.

Brand personality

Color scheme

The original color palette was functional. However, a few of the colors were tweaked for contrast to meet our web accessibility standards. Each of secondary bright colors is used to represent the challenge theme.

Typography

Solve’s brand typography wasn’t accessible for web usage, so I took this opportunity to explore new typography directions. Based on the team’s feedback, the brand type should convey ‘warmth’ and has ‘human’ characteristics to reflect a sense of community. Freight Sans and Freight Serifs were chosen for their humanistic qualities and large x-height which makes reading easier on screens. In addition, they come in a robust range of styles (thin, regular, medium, italics, bold, etc.), making them very versatile for different contexts.

Using photography to convey community

Photography is a powerful visual language. Images of real people in the Solve community are used to convey an authentic, diverse community. Stock photography can be used if needed. However, when using stock photos to describe an abstract idea or subjects, they should always include a human element.

Building a UI component library

In order to communicate a unified story effectively, we needed a cohesive UI component library that reflects the brand’s personality. We used this opportunity to replicate functions of our own internal component library for this project. This is a library of elements that can be reused, rearranged, and combined to create patterns that fit our communication needs. This system allowed us to streamline our design and development for the website, and served as a foundational visual language from which to build the application.

Mobile-first approach to prioritize what’s important

We used the mobile-first approach to prioritize what’s truly important to communicate. We took advantage of the limited space and mobile constraints to eliminate distractions and focus on the content hierarchy. I mocked up wireframes to serve as conversation starters to get consensus on what content to include.

A website to tell a unified story

In the effort to clarify Solve’s mission and promote specific business priorities like upcoming events and memberships, the homepage was designed to feature this information upfront. At the same time, we wanted to help users to better understand the value of participating in Solve challenges and the benefits of being part of the community.

Solve events

The events section was designed as a hub for Solve’s flagship events, and solve-a-thons. Attendees can find event information, schedules, and speaker bio for each event here. Solve administrators have the ability to update and edit content for all events in this section.

Challenge themes

Colors are used to organize content. Each color is assigned to a challenge theme, and all solutions under that theme. For example, red represents “Sustainability,” green represents “Health,” yellow represents “Education,” and blue represents “Prosperity.” This color theme strategy was intended to help users recall information as the challenge question changes each year, even though the theme categories stay the same.

Platform to better serve the community

The overall challenge for the application was how do we clarify the process and improve the user experience for potential Solvers, judges, and admins. We first approached this daunting task by breaking it down into manageable chunks. I framed each design challenge as “how might we” questions to help us generate ideas and features. Then, we prioritized creating the features based on available resources and time constraints. I worked closely with the core project team to determine the user flow for the submission process and identified these design opportunities to help the users achieve their goals.

1. How might we clarify the solution submission process to encourage potential Solvers to publish, participate, and interact with the community?

In order to grow the number of quality submissions, we needed to improve the submission process from the ground up by doing the following:

• Set clear expectations
• Make solutions editable
• Allow users to manage their solutions, get feedback, and discover other solutions within the same theme
• Support the community by joining a solution team, or offer support by giving feedback.

Designing the solution submission process
The solution submission process was designed to be flexible, allowing people to save and edit their work as they collaborate with the team and get feedback over time. The work is saved, and accessible in the user’s dashboard. I designed the progressive indicators to guide users and communicate which section still needs work so that when users come back at a different time to continue the process, they can recall their place easier.

The dashboard experience for each type of user
Participants dashboard experience displays the appropriate schedule of the challenge timeline, allowing them to manage their solution submissions, add team members, discover other solutions, and update their profile.

2. How might we better enable users to tap into the community for support and collaboration?

• Build a robust commenting system for submitted solutions
• Enable participants to create teams
• Help users discover solutions of their interested themes

Submitted solutions
Submitted solutions are published in the challenge theme section. To learn more about each solution, users can read more about it in its own solution section. Users can comment on each paragraph to give specific feedback and encourage participation.

Participant dashboard
Within the dashboard, recommended solutions are dynamically displayed based on users’ preferences. This allows users to discover others’ work. In addition, users can add team members to their solutions. The hope is to encourage collaboration as time goes on.

3. How might we clarify the judging process and enable judges to manage and collaborate better?

• Build a dashboard experience in the application to manage assigned challenges and solutions
• Designed a scorecard area to help judges keep all scores for all assigned challenges
• A scoring tool build in context of the judging journey to ease the process
• Designed a note area in the scoring tool to ease communication efforts between judges

Judging experience

The judges’ dashboard was designed to help the judging process easier. Each judge can manage and see their assigned challenges with a scorecard in one place. We also designed a judging tool that helps them judge solutions in context.

4. How might we enable admins to better manage all their tasks in one place?

• Feature the dashboard with overview of new users, solutions, and comments
• Make challenges, events, articles, and pages editable within the CMS
• Give admin the ability to create new challenges and users within the CMS
• Designed the ability to export solutions summary so staff can manage assigning judges to solutions

Results

We launched in May of 2017, and we’re excited to see the growth of the community thus far.

Conclusion

Working with the Solve team who values putting users first and creating a community to crowd-solve difficult challenges was very rewarding, and undoubtedly led to great results. The project contributes to Solve’s mission and ongoing strategy for being the marketplace that connects innovators to resources to implement their ideas. Working on such a complex project on a tight deadline helped us learn a great amount which we’ve used to improve the way we work on other projects.

Lessons Learned

• Building empathy for the users by writing design principles as a team. When we’re in the weeds working against technology and time constraints, it’s easy to shift our focus away from our users’ needs. One of the ways I find helpful to remind the team to be empathetic to our users is by contributing to writing design principles and participating in that process as a group. The sense of ownership in the act of writing help serves as a reminder as we go through the project because it becomes a part of our belief system.