top of page
cfsflaptop-01.png

Code for SF Case Study

A redesign of an inclusive volunteer group who uses creative technology to solve civic and social problems.

What is it?

Code for SF believes that a diverse group of participants is central to building technology that works for all residents of the city and county. On Hack Night, there's time dedicated for small groups to work on specific projects to encourage positive change.

Screenshot 2024-05-27 at 10.23.19 AM.png

The Problem

The free event seems to only attract people who have technical skills and doesnt represent the general San Francisco community. They need to attract people with more diverse backgrounds. This will help give more of a diverse approach to creating solutions during these Hack Nights.

​

“I DON'T KNOW HOW I CAN CONTRIBUTE TO HACK NIGHT."

- non technical person

Research

  • To conduct contextual inquiry we screened for SF Bay Area adults, individuals who are interested in volunteering and people who want to contruibute to with out technicial skills.

  • We conducted a Usability test with the current website .

  • Competetive and Comparative Analysis to see wha key features we were missing.
     

CodeForSF.webp

To conduct research, we attended a Hack Night and began asking some questions to other people that were there.

Collected email addresses and some information about them to help create personas.

Screenshot 2024-05-27 at 9.21_edited.png
Screenshot 2024-05-27 at 9.21.01 AM.png
contextual inquiry.png

Conducting a Usability test on the current site made us aware of the users pain points on trying to find information.

With these findings we were able to oragnize the information achitecture for a more easily navigatiable experience.

Persona

User Flow

Screenshot 2024-05-27 at 9.49.16 AM.png
Screenshot 2024-05-27 at 10.21.49 AM.png

Site Map

Screenshot 2024-05-27 at 9.48.49 AM.png

Checking out our competetion helped us see what is working for them and why. We were able to see what information and design elements they felt necessary to show and where on the page.

Competitive Analysis

Screenshot 2024-05-27 at 9.44.55 AM.png

Comparitive Analysis

Screenshot 2024-05-27 at 9_edited.jpg
Screenshot 2024-05-27 at 9.44.12 AM.png

Hypothesis

If Code for San Francisco’s website clearly displays ways for non-technical users to contribute to events, then non-technical users will be able to make a decision to attend Hack Nights, because many of them feel insecure about their lack of technical skills.

Solution

CODEFORSF.png

1

Took out the necessary skills. This list intimidated non technical users from showing up.

2

The site was extremely text heavy so we design the site with specific visual cues that will establish credibility,

3

Provided clear information to guide them to projects they want to participate in.

bottom of page