What we learned designing a social networking app for our student and alumni community

Jeff Stern
6 min readOct 20, 2016

--

Loops are powerful bits of code that allow a computer to run a block of code dozens, thousands, even billions of times over without getting bored. Need to show a list of a thousand Instagram pics? Playing the same song on repeat? Need a robot to flip pancakes while breakfast is served? Use a loop.

Now, Girls Who Code students and alumni have a new type of loop to use called Girls Who Code Loop. Girls Who Code Loop is not a programming construct, but an iOS and Android application — designed for our students, alumni, teachers and volunteers in partnership with the talented team at Small Planet. While in Loop, girls will be able to stay in touch with their Clubs and Summer Immersion Program and connect with the larger Girls Who Code community.

AWESOME! <From the Introducing Girls Who Code Loop video.>

In four years, Girls Who Code has grown from 20 students to more than 40,000 young women nationwide. As our community continues to grow — and distance and time separate them from their original Girls Who Code cohort––our mission to close the gender gap in tech demands that we continue engage our girls. It is not enough to teach girls to code for a couple hours each week; we need to sustain our alumni’s interest as they grow in their careers, communities, and capabilities. Designing Girls Who Code Loop, we learned a few things along the way that we would like to share with anyone in the educational technology space.

What We Learned

#1. Girls want to connect with the larger alumni network

Girls Who Code Loop is a “private social network” and you must be a registered student or alumni to access the network. We explored how our students are already connecting with their peers online. Their existing social networks are large, and our classrooms often create ad-hoc group messages that leave out the larger Girls Who Code community. We learned that girls lacked a connection to the Girls Who Code sisterhood across the US. We sought to create an experience that allows girls to stay in the loop with the breadth and expertise of our entire community.

Even within the context of this closed community, we provide girls the ability to opt-in to different “loops” ranging in theme from College Life to Programming Help to Selfies. All girls are automatically added to loops associated with their in-person classrooms. In these programs, girls will be encouraged to share notes and brainstorm ideas with the girls in their Club loop and solicit feedback from loops featuring girls from across the country. This juxtaposition of strong and weak ties will increase the cohesiveness of our entire network while supporting the close bonds that students form within their own classrooms.

“My first CS Class was 400+ students and I was so nervous walking in and then a girl who I met at a GWC function recognized me and it ended up that there were about 6 GWC in the class and now we all sit together.” — Lacey, College Life loop on Girls Who Code Loop

#2. We need to meet students on mobile

We built Girls Who Code Loop natively for iOS and Android after understanding how our students currently connect. First, we considered designing a website. A website requires dramatically less time and less developers than creating native apps for two different platforms. However, every statistic in the world shows that young millennials love mobile, and we need to take a mobile-first approach to meet our students where they are. Early data supports that hypothesis. On launch, our alumni spent an average of nearly 20 minutes of their day using the app.

#3. Our organizational values need to be translated digitally

Girls Who Code students value Sisterhood, Bravery, and Respect

Girls all commit to Girls Who Code’s core values when joining the app. On the first day of all our programs, we have girls create a “classroom contract” to establish shared expectations and understandings within their class. I am constantly amazed by the positive attitudes in our classrooms. We wanted to replicate these same environments but in a digital world — a world often ripe with hate. We created Girls Who Code Loop Community Guidelines that our girls see upon logging in. As an organization invested in youth development, we regularly review content to ensure we are fostering a positive environment for these burgeoning computer scientists. So far, we have seen the same types of positive behaviors in Loop that we expect from our students in the classroom.

#4. Design should reflect the users’ identity

We invested resources into designing a community that felt uniquely ours. When it came time to select an app icon, our office was torn. We had it narrowed down to two choices, a classic infinity sign and the geometric loop that you see above. The classic infinity loop clearly communicated “loop”. However, as several students told me, it looks “like every other app”, nothing about it communicated computer science, and (as one student told me) “infinity loops are just not very trendy right now.” The “programming loop” symbol that we selected is admittedly a bit more obscure, and you might not realize at first glance that it is made up of classic coding elements (< / >). But our girls certainly did. In several A/B tests, the geometric loop dramatically outperformed the classic infinity loop and it feels distinctly ours. One girl said, “I like the new icon because it reminds me of when I learned to code.”

The value of strong design cannot be understated. We hope that our students will associate their continued peer relationships and learning with our organization.

The programming loop symbol and aesthetic of Girls Who Code Loop is right for our audience.

#5. We learned how to run user research sprints within agile

We ran agile research sprints to receive quick, actionable feedback from students. From Miami to San Francisco and from middle school to college-aged girls, we collected user feedback from the entire spectrum of our diverse alumni community. We built this app with a group of talented developers and designers at Small Planet working in an agile process on two-week development sprints. We also layered on two-week user research sprints. User research is a critical part in the design process that involves talking with and putting what we’re building in front of authentic users and receiving real-time feedback.

We use a “Raised Hand” icon throughout the app for girls to indicate when they have a question or need support. We learned through user testing that this emoji can be interpreted in different ways (“Stop!”, “High five!”) and we prioritized introducing this concept during on-boarding and in product messaging material.

Each of our two-week user research sprints looked both backward and forward. We collected feedback and conducted user tests to examine what we built in the previous sprint, and we tested assumptions about what features we prioritized for future sprints. This feedback allowed us to make usability enhancements, and it informed critical decisions about what was necessary for the Minimum Viable Product and what we deferred to the product roadmap for a future app update.

We’ll never stop learning

Now that we have launched Loop, we are excited to learn from our girls and engage with them in this new mobile space. Our app will continue to mature as our student and alumni population grows. Girls Who Code is already providing the absolute best in-person computer science learning experiences for middle and high school girls; we plan to continue to innovate our programs and the experiences of girls inside and outside of the classroom.

Our students and alumni can download Girls Who Code Loop on iOS and Android. Learn more at http://girlswhocode.com/loop

My name is @Jeff_Stern, and I am the Director of Product Innovation at Girls Who Code. Our team designs and develops unique experiences for our current learners, alumni, and new audiences. We are grateful for our partnership with Small Planet and their iOS and Android app development expertise. Thank you to the countless alumni that provided invaluable feedback. And last but certainly not least, thank you to the entire Girls Who Code team that contributed to and supported the launch of Girls Who Code Loop.

--

--

Jeff Stern

Product manager @Tidelift | Working remote from PHL (with ❤ in NYC, SF, & A2)