Chirp is a hyper-localized platform for neighborhood communication, available as both a mobile app and a website. Users can ask questions, create events, sell items, and message others. Chirp empowers users by allowing them to moderate content, ensuring the information is accurate and validated.
Feeling safe, connected, and informed is crucial to being a good neighbor and active community member. However, finding relevant local information and feeling safe interacting with strangers can be challenging. These issues deter users from building a sustainable and active community.
Chirp aims to provide an engaging and enjoyable user experience by delivering hyper-localized neighborhood information. It allows users to moderate content and offers a user-friendly application that promotes active community interactions.
We adopted a user-centered double diamond design process comprising four major milestones: discover, define, develop, and deliver. These milestones are carried out through four major steps: (discover) idea generation, (define) narrative and mid-fidelity prototyping, (develop) usability evaluation, and (deliver) high-fidelity prototyping. With an iterative mindset, we worked in 1- to 2-week sprints to mimic an agile environment in the real world while meeting deliverables at each major milestone.
As part of the idea generation process, we created a mood board to help us establish a sense of brand personality and an overall tone for our design. We then conducted a design charrette to illustrate preliminary sketches and initial ideas. Lastly, we created a typical user persona with a user scenario to express user empathy by implementing our design to solve a user problem.
Our mood board defines Chirp’s experiential and emotional aspects, incorporating our combined inspiration, aesthetics, and desired emotional impact. The aesthetic goal is to create a welcoming, warm, and friendly space that fosters connections and community bonding. This is depicted by Chirp’s values and mission.
We sketched our initial vision, including potential features, functionalities, screen flows, and user stories. Key considerations from the charrette sketches include user account creation/login, home screen, maps, and messaging. These features aim to connect users with their neighbors while ensuring safety.
Our persona illustrates the typical user of Chirp. We wanted a visual representation of who we envisioned using the application. Understanding the standard Chirp user before moving forward in the design process was essential for our team. Jill possesses traits and values embodying Chirp’s mission of cultivating community and providing users the assurance that their information and content are safe.
The scenario delves into the process Jill takes of making an account and using Chirp, highlighting key features of the mobile app. Our team thought creating a scenario would help us better navigate the steps a user may take while using Chirp for a specific goal. We wanted to incorporate circumstances that aligned with the lifestyle Jill experiences.
Jill recently moved to Pilsen and is on the hunt for things to do with her children. Unlike her spouse, Jill takes the initiative to discover local activities. Before she moved to Pilsen, Jill recalls her cousin mentioning an app called Chirp that helps newcomers become acclimated to the neighborhood. After moving into the neighborhood, Jill signed up for Chirp by verifying her residence. On the homepage, Jill finds a post about a children's Easter egg hunt happening at a local park.
Excited, Jill saves the post and makes a note to tell her spouse about this amazing opportunity. It would be nice for her kids to make new friends, and Jill can get to know the other parents in the neighborhood.
On the day of the Easter egg hunt, Jill responds to the post and asks when the other parents are showing up. Numerous replies come in, stating that parents and their children will show up around 11 am. Jill is eager for the Easter egg hunt, and can't wait to make new connections in the neighborhood.
Jill spotted a few familiar faces from Chirp at the Easter egg hunt. She walks over and introduces herself to the other parents, solidifying the beginnings of a new friendship in her new neighborhood.
After the event, Jill goes on Chirp and joins the "Moms" Nest, a place where she can see posts relevant to being a mom, which is important to her. Jill feels confident that the community validates the posts on Chirp.
Our narrative digital prototype communicates ideas to potential investors and decision-makers, ensuring we understand the business value and incorporate our competitive features into the design process. Alongside the narrative digital prototype is a medium-fidelity prototype. This prototype showcases the main features of Chirp and focuses on usability as opposed to functionality and aesthetics.
Our idea of Chirp is similar to Nextdoor; an existing app that allows users to connect to their neighborhood and engage with other users. We conducted a competitive analysis to demonstrate key differences between Chirp and Nextdoor. Our team found it beneficial to note these differences, and how Chirp sets itself apart from the current market so that potential investors can witness the uniqueness of Chirp and what it brings to the table.
Below is a user happy path for Chirp; portraying ideal routes users take to achieve creating an account, moderating a post through reporting it, and visiting a Nest. Our team wanted to create happy paths for the mobile version and the website, as they differ slightly in appearance.
A usability study was conducted to learn how users react to our initial design choices in the form of a medium-fidelity prototype, including information architecture, general layout, navigation, and overall satisfaction with the application. We recruited six volunteers to participate in a moderated testing environment where each was given three task scenarios to complete on both the mobile and desktop interfaces. Following the completion of the tasks, participants were surveyed on their satisfaction with both channels.
Results of the usability tests showed that participants had an overall good impression of the medium-fidelity prototype. All participants performed tasks successfully and averaged a 4.5/5 on ease of navigation. The website scored a bit higher than the mobile version in regards to organization, but along with this observation, there were other recommendations we implemented in the high-fidelity prototype.
Usability changes made include:
• Changing “join” to “visit” when viewing popular Nests for the website.
• Having “upload” as the only option for address verification for the website.
• Having “take a picture” as the primary action for address verification for the mobile.
• Adding “bill” and “letter” as options for address verification for the mobile and website.
• Increase the font size of “create an account” during account creation for the website.
• Add a modal containing a breakdown of why a user’s address is required for the mobile and website.
Aesthetic changes made include:
• Change “your” to “my” for nests, feed, etc. for the mobile and website.
• Have reported posts hidden from view for the mobile and website.
• Add information to the side of the screen when visiting a Nest for the website.
• Left align items in navigation, add icons and color adjustment for the website.
• Replace “why do you need this” with “why is this needed” during the account creation for the mobile and website.
Considering this to be the final version of Chirp, we wanted to incorporate all the feelings depicted in the mood board while also implementing changes and recommendations from our usability tests in the hi-fidelity prototype. The style guide standardizes the design and other visual elements of Chirp. Our team also developed components to translate our style guide into tangible designs we can reuse. This is to maintain consistency while adhering to the style guide. Style Guide, Hi-Fi prototypes, Components
Upon reviewing all work put into creating Chirp, our group is content with our product. The most significant aspect of this process was conducting usability tests. It was necessary to gain insight from potential users on their perspectives; while we produce ideas and designs we also look at participant responses and see if they align. Usability tests solidified many design choices we had made, but also exposed flaws in design and usability. We believe that conducting these tests allowed us to refine our design in a way that empowered users to feel that Chirp was made with them in mind.
During this process, our team also discovered new tools to collaborate. These tools enhanced teamwork and made remote group work efficient. Our team learned from one another and developed new skills that we can carry forward into other projects and endeavors.
• Usability testing enabled our understanding of feasibility and desirability in our design.
• Adhering to design thinking throughout our process by connecting back to our problem statement is imperative for staying on track.
• Collaboration using new tools such as Figma and Figjam enabled our team to quickly iterate and convey our ideas.