QuLab

An open source project repository and professional development platform for women in quantum computing.

Context

Capstone project for MHCI+D
Advised by Google

Team

Mary Li
Juan Carlos Santos
Angela Xu

Duration

Mar 2021–Aug 2021 (20 weeks)

Contributions

Collaborated with teammates to conduct literature review.
Collaborated with teammates in planning primary research activities. Facilitated 2 expert interviews, 2 participant interviews, and 2 participant mapping activity sessions.
Analyzed 2 organizations for competitive assessment.
Collaborated with teammates to analyze and synthesize data collected from research into key insights and identify design principles.
Generated 20 ideas during concept ideation and worked with teammates to downselect.
Collaborated with teammates in refining concept and specifying interactions and features. Collaborated with teammates in creating concept storyboard.
Collaborated with teammates in creating wireframes and early screen designs. Responsible for making high-fidelity screens for the Browse and Search pages.
Illustrated final video storyboard.

Background

Project Context

QuLab was my team's final capstone project for the MHCI+D program. We were advised by an industry partner from Google, who was a designer working closely with the Google Quantum AI team. She came to us with the idea to explore the space of quantum computing for our project, with the suggestion to design something to help educate students or policymakers and executives about quantum computing and help them gain an intuition of basic concepts from this highly technical and counterintuitive subject area. However, after conducting some background research on the field of quantum computing, we ended up identifying a different problem space that we wanted to explore and create a design response for.

Problem Space

Quantum computing is an emerging field based around the development and usage of quantum computers. With their superior computing power, quantum computers may be used to solve extremely complex problems in areas such as artificial intelligence, medicine, climate, finance, and cybersecurity. But for a technology that has so much potential to do good, there’s always a danger of it doing harm, whether intentional or not. So we have to ask: who’s involved in building this and who’s not? Who’s getting a say in how this tech should be used and who isn’t?

Like many other STEM fields, there is a lack of diversity in quantum computing. Not only is diversity important in mitigating bias in technology, it’s also valuable to have different perspectives and viewpoints when solving problems. While there are many underrepresented groups in quantum computing, we decided to focus on women for this project.

Design Response

QuLab is an online platform that helps women in quantum computing and allies build a professional community by working on quantum computing open source projects together.

Video

Features

Projects

QuLab's collection of open source quantum computing projects provides a centralized hub that streamlines the experience of finding projects to work on and finding teams to work with.

Profiles

QuLab's user profiles provide a comprehensive overview of a user's skills, work, and interests.

Profiles showcase users' work and contributions both on and off the platform, creating a centralized record of their work and acting as a living resume.

Browse

QuLab also helps users discover interesting projects and get a sense of what's going on in the community. On the Browse page, users can explore the breadth of topics and applications within quantum computing and also see the incredible work being done by fellow community members.

Incubator

QuLab's Project Incubator is a space for users to pitch new project ideas, which will be voted on by community members. The community can also chime in on pitches by commenting and suggesting additions or improvements to the idea. If the pitch garners enough votes, it will move forward as a full project.

Research

Objectives

We first conducted research to learn more about the quantum computing industry and what it was like to be a woman in the field. We wanted to learn what drew women into quantum computing and what kept them interested in it. Conversely, we also wanted to learn what discouraged them and drove them out. And considering the interdisciplinary nature of quantum computing and the relatively small size of the industry, we wanted to see how the quantum computing community affected women’s experiences in the field.

Methods

Literature Review

To help us form our initial research objectives and to get a high-level view of the space in question, we conducted literature review of 28 articles and sources about the quantum computing and the state of the industry.

Expert Interviews

To get a deeper understanding of our space, we conducted 6 subject matter expert interviews. We spoke to 2 industry professionals and 3 academic researchers within quantum computing to get a better understanding of the field. We also spoke to 1 STEM educator to get some insight into what motivates and demotivates female students in STEM.

Competitive Assessment

We also completed a Competitive Assessment of 6 quantum computing or STEM-related organizations to see what kinds of educational or community building initiatives were already out there in these spaces.

We also wanted to see what they were doing well while also determining opportunities for improvement that we could potentially apply in our future design response.

For the full report, please see the Competitive Assessment file below.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

 View full Competitive Assessment

Analysis of one of the organizations we looked at. View the full report for all analyses.

Semi-structured Interviews

From here, our research began to dig deeper into women’s experiences in the quantum computing field. We conducted Semi-Structured Interviews with 8 participants, 7 women and 1 nonbinary person, working in the quantum computing industry to learn about their experiences as a professional in the field.

Interviews with participants were conducted remotely over Zoom.

Mapping Activity

Of our 8 participants, 5 of them also took part in a Mapping Activity that we designed to get a more in-depth understanding of their interactions and relationships with others within the QC community.

Participants created these maps by drawing circles to represent the communities they engaged with, then added triangles and squares to represent particular individuals and groups of people they interact with in those communities. The colors indicate the participant's feelings toward these communities, individuals, and groups, with green meaning positive, yellow meaning neutral, and red meaning negative.

As participants created their maps, we asked them to further elaborate on their decisions to include these communities and people on their map, as well as the colors they assigned to them.

An example map that a designer might make of their community.

The mapping activity was conducted virtually over Zoom, with participants creating their maps on a Google Slides template we provided for them.

Data Analysis and Synthesis

After each interview session, we went through our notes and picked out notable highlights from the interview. We took these notes and created an affinity diagram, grouping together similar themes and messages.

Notes and highlights from interviews.

Affinitized notes.

Insights

Through affinity mapping, we were able to identify patterns and repeated themes across our research, which led us to form several insights. Our 4 key insights are shown below, though we did come up with additional ones (which can be found in our full Research Report).

Insight 1

Those who persevere through all the judgement have received positive peer support.

“One of the reasons that I really enjoy mentoring is because I've personally had a lot of really great mentors and so, that's something that I [...] often talk about with my mentees as well is if you don't like your manager, if there's something wrong with like, your relationship with your manager, address that early [or] figure out if you can have a different manager.” –P1

Insight 2

Educating others help women feel control and ownership over quantum computing.

“Interacting with all students, I find rewarding [...] I like to give back in any way that I can, and I find that emotionally rewarding, so in that way, you know, it's emotionally supportive, [...] I just feel like I'm helping people.” –P3

Insight 3

Women are taking it upon themselves to address issues in the community through different initiatives.

“I see the same few people gatekeep people out of the field, how much I see the same few prominent sexual harassers hurt people over and over again, you know. And the feeling that, if I can go make things easier to use, go make things more inclusive and more expansive, then maybe that gatekeeping doesn't have to be that way.” –P7

Insight 4

To achieve meaningful long term change, there needs to be diversity at the top.

“The people in the position to make decisions don't necessarily buy in. Like, they'll say with words, ‘Yes, diversity is important to us, inclusion is important to us’ and then like, nothing actually happens. So that's, I think, the biggest problem we face right now is buy in. From a lot of people who don't fully grasp that this is an issue.” –P1

Target Audience

From our initial research findings, we identified two potential audiences that we could design for: women who were already working in the quantum computing industry and women who were not but were interested in entering the industry. After completing our primary research, we decided to focus on the former: women who were already in the industry. While bringing more women into the industry was important, we felt that supporting the retention and promotion of women who were already in the industry was also critical in cultivating, as well as sustaining, an inclusive workforce.

Design Principles

Based on our insights, we developed 4 design principles to help focus the development of our design response.

Provide Shelter

Provide women a safe, inclusive, and non-judgemental space.

Normalize Experiences

Build internal support structures that amplify women’s voices.

Highlight Truth

Encourage truthfulness by balancing expectations with scientific integrity.

Showcase achievements

Provide opportunities for recognition that show and validate hard work.

Research Report

For more details of our research activities and findings, please see our Research Report below.

 View full Research Report

Ideation

Sketches

With our design principles in mind, we moved into our Ideation phase. We each generated 20 concept sketches, for a total of 60 ideas.

Our 60 initial concept sketches.

Downselection

We started downselecting by grouping together similar concepts into larger ideas or themes. After grouping, we were more easily able to vote on concepts that best aligned with our design values while also being feasible for us to build.

In the end, we were left with a small set of ideas and groupings that we were able to combine together into a single concept: an online platform for women to collaborate on open source quantum computing projects. This concept would go on to become QuLab.

Our final set of concepts and concept groupings.

Storyboard

After choosing a concept to move forward with, we began to brainstorm and identify values and outcomes that the platform would provide. Then, we began outlining a story to highlight these values and start envisioning the key interactions that would take place in a user's experience with the platform.

Outlining the platform's values and planning out a scenario to demonstrate these values.

From there, we put together a storyboard to illustrate the key moments that someone within our target audience would experience when interacting with our design.

We imagined a scenario in which a woman feels dissatisfied, unrecognized, and isolated working at her current job at a quantum computing company. She is then introduced to QuLab, where she finds a project she is interested in and is looking to recruit a new team member with skills like hers. She joins the project and enjoys working alongside her new teammates, who make her feel like she belongs. As the project continues, she posts updates on QuLab to share her team's progress and engage with the larger community. Another QuLab user sees her updates on the project and checks her profile to learn more about her. They reach out to her to ask if she would be interested in joining their company. At her new job, she feels much happier—she's in a higher position, working on interesting projects, with supportive teammates. She wants to help uplift others in the community, so she starts a project of her own on QuLab. On this project, she mentors students and other people who are early on in their quantum computing careers. She feels fulfilled helping them grow their skills and get closer to achieving their career goals.

The final version of our storyboard, made by sketching on top of stock images.

Prototyping

User Flows

Once we determined key interactions through our storyboard, we fleshed out the interactions in more detail by making user flows. Below are the main user flows that would occur in the scenario depicted in our storyboard.

Three main user flows.

Information Architecture

After generating our main user flows, we expanded outward and began thinking about the structure of the whole platform. Below is a map showing the hierarchy of pages on the platform. Note that this map is not exhaustive—it does not include all the pages that would be under Community and Workspace, as we were not focusing on building out these areas of the platform at this moment in time.

Platform information architecture.

However, it was not feasible for us to prototype the entire platform in the time we had remaining for this project, so we focused on building out just a few important pages.

Based on the scenario illustrated in our storyboard, we determined that the most pertinent pages were the Browse, Search, Project, Profile, Project Incubator, and Create Pitch pages.

(We actually did design some other pages under Community and Workspace in early iterations, but decided to cut them out for the final iteration as we didn't think they were crucial to the story that we were focusing on.)

The small subset of pages we decided to focus on.

Wireframes

From there, we began to make wireframes of the main pages of the platform. We started by each making our own versions of the pages. Then, we compiled our individual layouts and marked aspects and elements we liked and wanted to include in our next iteration.

We laid out our individual wireframes and circled bits and pieces that we liked.

Screen Iterations

We began fleshing out our screen designs, once again working separately to generate multiple iterations in parallel. Just like before, we came together to review our individual designs and pick out elements that we wanted to carry over to our next iteration.

Individual screen designs of a Project page.

After deciding on a single visual design system, we worked together to continue refining our screens.

Early Profile page design.

Early Project page design (Values tab, Open Positions tab, and Updates tab).

Early Browse page design.

Feedback

At this point, we asked a few of our participants for feedback on our design. We showed them our storyboard, explaining the purpose of this platform and how one might use it. We then showed them our screen designs. The overall concept seemed to be well-received by our participants, but they did provide us some very helpful insights and pointed out areas that would benefit from further clarification.

More tailoring for our target audience

This platform would be excellent for students and others looking to enter QC to gain experience, but women already working full time in the industry may not be able to dedicate a lot of their time and energy toward side projects. However, there is still a lot of potential for those already in industry to utilize this platform to find talent for their companies.

How we addressed it

Although women in industry may not have much time for projects outside of work, we proposed that they can still be involved in these projects, but in less time-intensive roles such as an advisor or a mentor. They can help oversee projects and provide guidance and feedback.

We also added in company-sponsored projects. For those already working in industry who want to provide opportunities for people to work on projects in collaboration with their companies, they can indicate that their project would be sponsored by their company when pitching it.

Ease of finding info

When looking at Project pages, it would be helpful if there were tags at the top so users could quickly get an idea of what the project is about at-a-glance, rather than having to skim through lots of text.

It would also be nice to have links to project source code, documentation, assets, etc. so users can take a look at the current work. Similarly, it would be nice to have links to portfolios, social media, etc. in user Profiles so others looking at a Profile can easily view that user's works that live outside the platform.

How we addressed it

We were already utilizing tags in Browse/Search and Profile pages, so we simply added tags near the top on Project pages. We also changed and unified the look of tags so they would pop out on all the pages they were on.

We also added quick links to project files and docs at the top of Project pages for easy access. On Profiles, we added a Contact button that opened up a modal containing the user's contact information, website, social media, and other links.

Ease of Populating info

Since a user's Profile is intended to be a record of all of their works both on QuLab and off QuLab, the easier we can make the process of populating info from external platforms, the better.

When users want to make their own project, it may be difficult for them to determine what kinds of roles they might need for their project and how to write the descriptions for these roles.

How we addressed it

We proposed a feature in which users can import data from platforms like LinkedIn and Github so they don't have to populate that information again if they already have it on external platforms.

We conceptualized a tool called Project Assist that would provide suggestions, templates, and other resources to help users as they put together their project pitches.

confusing IA/Navigation

The navigation is inconsistent in some places and it's also not very clear how the links correspond to the information architecture. (e.g. When a user clicks on My Workspace, Community, and Jobs, what page do they land on? What happens when they click on QuLab?)

How we addressed it

We reworked the information architecture such that Browse would be separate from and on the same level as Community. We also decided to remove Jobs as that was a reference to a feature that we had envisioned but weren't immediately developing. We also designated the Browse page as the main landing page of the website, making it the homepage for logged-in users and the page users would land on if they clicked QuLab in the navigation.

After reworking the information architecture, we fixed the consistency issues by creating proper components for the navigation bars.

Final Screens

Home/Browse

1. Spotlights

Articles featuring projects and people, showcasing users’ work and achievements.
Helps users discover new projects and people.

2. Explore Tags

Clicking on a tag populates a search query for that tag.
Helps users discover projects by interests/technologies/other categories.

3. Trending Projects

List featuring projects that have been gaining popularity recently.
Shows users what projects other users have been interested in lately and what the community is currently excited about.

4. Upcoming events

List showing local and online events and networking opportunities.
Possible integration with other platforms (e.g. Meetup).

The Browse page, which is also the main landing page of the platform.

Search

1. Search

Type search queries into the search box.
Filter by Projects, People, or Events.

2. Advanced Filters

Various options to narrow down search results (e.g. women-led projects, team size, project status, mentorship opportunities, location, project type, open roles, etc.).

3. Sort

Default sorting by Relevance. Other options include Newest, Popularity, and A–Z.

4. Search Result

Short description of project.
Tags provide quick look at what the project is for, what technologies it uses, company sponsor, etc.
Roles that the project is recruiting for.
Follow button for quickly following projects.

The Search page.

User Profile

1. Follow/Contact

Follow button allows users to get this person’s updates in their community feed.
Contact button pops up a modal with user’s contact information, social media, website, portfolio, research, etc.

2. Skills/Interests

Skills and interests displayed in tag form.
Provides a quick summary of who this user is, what they are capable of, and what they are interested in.

3. Project Contributions

A list of projects this user has worked on and how they contributed to them.
Data pulled from projects on QuLab. Can also import data from user’s external linked accounts (e.g. LinkedIn, Github) to automatically populate info, reducing the burden on the user to manually fill in.

4. Community Posts and Comments

A list of the user’s community contributions (community posts and comments).
Shows how they have helped others and demonstrates their thinking.

A user's Profile page.

Modal with user's contact information.

Project - Landing/Values

1. Join/Follow

Clicking Join leads to Open Positions section where the user can view what roles the project is currently recruiting for.
Clicking Follow allows users to get that project’s updates in their community feed.

2. Header Info

Contains short description of project, preview of contributors, quick links to source code, assets, etc., and tags.
Tags provide quick info about project, technologies, company sponsor, etc.

3. Values

Speaks more to what the team is like rather than the project itself. May include team values, code of conduct, work style, etc.
Helps users determine if they would work well with the team.

A Project page, which lands on the Values tab.

Project - Members

1. Members

Shows all contributors on a project and their roles on the project.
Clicking on their icons leads to their profile pages.

The Members tab of a Project page.

Project - Open Positions

1. Open Positions

Shows the types of roles that the project is currently recruiting for and a description and desired skills for each role.
Clicking Apply leads to a contact form to be sent to the project team. User interested in the role attaches a message and any additional materials (e.g. website, portfolio, research, etc.).

The Open Positions tab of a Project page.

Project - Updates

1. Updates

Project status updates let the rest of the community know about their progress.
Adds more transparency and authenticity to help mitigate the secrecy that leads to competition and overhype within the field.

2. Comments

Users can comment on updates and provide feedback or help.
Facilitates discussion.

The Updates tag of a Project page.

Project Incubator

1. Project Incubator

Users can pitch ideas for projects through the Project Incubator.
Pitches are vetted by the community through a voting system. Pitches that garner enough votes can move forward to become full projects on the platform.
Helps gauge community interest in ideas and mitigates unrealistic projects.

2. Pitch

Name of pitch, short description of idea, and the user pitching the idea.
Type of project (e.g. long term, short term, fun project, etc.)
Tags providing quick information about the project, technology, company hosting, etc.
Pitch o’ Meter shows pitch’s progress toward being greenlit.
Click Vote to support the pitch. Shows how many days are left to vote for this project below the button.
Clicking on the pitch card leads to a page with full details about the pitch and a comments section to leave suggestions and feedback to improve the idea.

The Project Incubator page.

Create New PItch

1. Project Assist

A tool that helps users build a project by providing recommendations and templates.
Learns what to suggest based on what the user had filled out in certain fields as well as by pulling from previous project pitches.

2. Sponsored Project

Users pitching a project as part of their company can indicate that the company is hosting the project.

3. Roles

Users indicate the roles the project would need starting out.
Project Assist suggests roles that the project might need based on the project description, project type, and other previous fields.

The Create New Pitch page.

Visual Design

Video Prototype

We created a video prototype to showcase the key moments throughout a user's interaction with QuLab. We wrote out a voiceover script, then made a storyboard to plan out our shots. We filmed our shots within a day.

Video prototype storyboard with voiceover script.

Shots were filmed with a smartphone camera on a gimbal.

Design Documentation

For detailed product specifications and visual system documentation, please see our Design Documentation file below.

 View full design documentation

Future Work

Building Out More of the Platform

Due to time constraints, we decided to design only a few of the most important pages for one particular user flow. There are many pages on the platform that we didn't have time to flesh out, particularly community-related pages and user workspace pages. If we had more time on this project, we would definitely want to work on these parts of the platform.

Safety and Inclusion Efforts

We would also like to focus on safety and inclusion efforts. Women and other marginalized groups are often the target of harassment and abuse on online platforms, so we want to ensure our users’ safety.

What we have in mind so far to help achieve this safe space is to create a code of conduct and a moderation system to enforce this code of conduct. In addition, we would like to develop a system of vetting users before they can join the platform in order to keep bad actors out.

Providing More Options For Involvement

We’d also like to further expand the options for involvement and provide more opportunities to users at various stages in their quantum computing careers.

User Testing

We would also like to continue testing and refining our prototypes. While we were able to gather feedback on some of our early screen designs, we did not have the time to do any involved tests.

Assessing Long-Term Efficacy

Since a user’s engagement with QuLab would generally be long-term, we’d like to identify factors to assess the long-term efficacy of the platform.

Reflection

Despite this project being the culmination of all that we learned throughout our Master’s program, there were definitely some challenging moments and things we didn’t expect.

Adjusting Our Problem Space

We grappled with a lot of ambiguity, especially in the Research half of development and we ended up adjusting our problem space quite a bit as we learned more through our research.

Grappling with Scope

We also grappled a lot with scope. What we were dealing with was essentially a wicked problem, so we really had to narrow down to make this problem space more manageable. But even still we often found ourselves asking questions like, Who is this for exactly? What about these kinds of users? Should we only focus on these people? This project really challenged us to put stakes in the ground and make decisions in order to not hem and haw over these questions forever.

Role as a Discussion Piece

In the end, we designed a product that maybe isn’t the most viable thing in the world. But I think there’s still quite a lot of value in it as a discussion piece. When people talk about quantum computing, issues of diversity don’t really get discussed that much. Even if this project isn’t something that would realistically take off as a platform, it can still raise awareness about these very real problems in the industry.