What students in the Bronx taught us about designing for humans

Photo credit: Kasumi Abe

The sixth-period bell rang, and students began filtering into the computer lab. In between placing bets over which basketball team will win the NBA Finals, students logged into Cacoo to pull up the wireframes and mockups for their final presentations.

From Japan to the Bronx

Last week, our Nulab NYC team organized a design challenge with Brian’s 10th-grade Computer Science class at the Bronx Academy for Software Engineering (BASE). BASE is a new kind of city public school for students living in under-served communities. Founded in 2013, it is a four-year technical education high school that gives students training in computer programming, software design, and app development. The 50 students in Brian’s class will be BASE’s first graduating class.

For their last design challenge of the school year, we “hired” Brian’s students as consultants to help us answer the following question: How might we improve Cacoo for the student learning experience?

During the week, students worked through the different phases of the Design Thinking Process. They took one task, using Cacoo to create a flowchart, and conducted usability interviews with each other to develop empathy for the end user–themselves. They then reviewed their interviews to understand and define the key pain points that students experienced. Using their findings, they ideated on how to improve Cacoo’s usability and user experience, built wireframes and mockups, and created a final presentation to share their work with us.

Photo credit: Kasumi Abe

The First Law of Usability: Don’t Make Me Think

Renowned information architect and user experience expert Steve Krug often gets asked,

“What’s the most important thing I should do if I want to make sure my Web site is easy to use?” And he says, “The answer is simple. It’s not ‘Nothing important should ever be more than two clicks away,’ or ‘Speak the user’s language,’ or even ‘Be consistent.’

It‘s…Don’t make me think.”

As we listened to the students present, we heard a reoccurring sentiment–students were expressing similar issues with readability and findability. When students opened Cacoo’s editor to create a flow chart, many claimed that they felt disoriented because they couldn’t find where the shapes were. To paraphrase some students,

“We read from left to right, so naturally we looked for the shapes on the left side of the editor first, but since it wasn’t there, it took us a little more time to find where they were and start creating.”

When they did find the shapes for creating, no sooner did they encounter more readability and findability issues.

“The buttons are too small and close together. It’s hard to see easily which button does the job I want to get done.” OR “Some of the icons on the buttons are confusing. For example, the ‘i’ could be info or help. People who’ve never used Cacoo wouldn’t know that it actually means ‘inspector’, which is where you find more editing tools.”

Through this exercise, the students discovered the main sources of confusion and frustration that made Cacoo’s editor not that easy to use.

Out of the 15+ teams that presented, two teams stood out. Demonstrating their deep empathy for the end user, these two teams provided unique ideas to answer the original question we posed at the beginning of the challenge: How might we improve Cacoo for the student learning experience? The two winning teams moved their ideas forward, designing mockups that helped us visualize a new Cacoo editor that…didn’t make students think so much!

When you look at the recommendations these students made, no one talked about fancy features or flashy animations. Instead, they focused on the little things. Like moving the stencil panel to the top or left side to improve findability for most users that naturally read from left to right, top to bottom. Or increasing button size by 5-10 pixels. And maybe using more universal icons to improve understanding of each button’s true functionality. When you add it all up, all these little things make all the difference for the end user’s experience.

To reward their excellent and thoughtful work, each student from the winning teams left off with a new backpack, school supplies and a fresh Head First Java, intro to Java programming book. How about that for summer reading? We were fortunate to spend this week with Brian and the students, learning from each other, and leaving with smiles and a memorable experience.

Until next time,

From New York with love.

Photo Credit: Kasumi Abe