top of page
Untitled (9).png

James Landen

Title (3).png

Waggle was a personal project for me in more ways than one. Thinkful tasked us with designing an app that we would actually use. As the parent of a special needs dog, I saw an opportunity for a meetup-style app that spoke to more than human advocacy alone.

​

​

 

Roles

  • Researcher

  • Designer

  • Writer

  • User Tester

Tools

  • Figma

  • Google Suites

  • Vectr

  • Usertesting.com

  • Miro

Timeframe

  • Three Weeks

The Challenge 

Going back to basics, I used the Double Diamond Design format for my design process. Through Discovery, Definition, Development, and Delivery, I sought to create my most complex app yet. 

​

​

​

 

Double-Diamond.png

Project Overview

While my clients were technically human, I wanted our furred friends to get as much out of the app as possible. Waggle is an app for users that care for their dog's social well-being. Social media-inspired, Waggle allows users to chat, share content, and plan/attend meetups that open up social avenues for dogs and dog parents alike.

​

 

PROBLEM

  • When using an app to attend a meetup or soucing a playmate for your dog, apps fail to supply you with enough information to gauge the dog's compatibility.  

​

  • Existing apps don't allow for in-app event creation or planning outside of already being in a group. 

​​

SOLUTION

I needed to design an app that would:

​

  • View and share dog and dog-parent-related content

​

  • View, join, and create dog and dog-parent-related meetups and playdates

​

  • View and share highly detailed information on both dogs and dog parents

​

 

1) Empathize

While I already understood some of the struggles that pet parents can experience, I needed to do a deep dive into other dog parents needs. Through surveys, interviews, and competitive analysis, I would glean new information to shape my first design project.

 

SURVEY

I ran Google Forms surveys with 21 participants.

 

1) 75%

of pet parents believed it to be important that their dog was social with other dogs on at least a yearly basis.

 

2) 80%

of participants wanted to know detailed information on their dog's playmates, such as vaccination status and energy levels.

 

3) 60%

of participants listed Instagram as their preferred form of social media and found it to be the easiest form of social media for making new friends and developing new relationships

​

​

 

USER INTERVIEWS

To gain a deeper understanding of how dog owners think, I interviewed known dog parents. I prepared a session guide, a materials checklist, and a script for my interviews. Notable quotes include:

 

"The other dog has to act excited otherwise she can see it as being aggressive."(When talking about how their dog can be stressed at their local dog park)

​​

"I just try and make sure there aren't too many other dogs around."(Same user talking about their dog park experiences.)

​​

 

"They also need to not be "fluffy"(When speaking to negative experiences their dog can have with other dogs.)

​​

"People can be a little too friendly if you catch my drift."(Female dog parent talking about men she encounters at her local dog park.)

​

​

COMPETITIVE ANALYSIS

My next step was to browse the app store for dog playdate apps. I was very surprised to find that while dog-themed, they all appeared to be clones of Tinder. Already knowing that I wasn't going for a dating app, I decided to lean into Meetup and Instagram for inspiration.

Screen Shot 2022-12-10 at 3.57 1.png

Meetup

Strengths

Weaknesses

  • Large user base, diverse meetup catagories

  • User ability to approve/deny attendees

  • Group chat function

  • Fully integrated mapping system

  • No way to view/share detailed pet information

  • Single "dark mode" version of app

  • Group chat only available inside existing group

IMG_5982 1.png
IMG_5983 1.png
IMG_5980 1.png
Screen Shot 2022-12-10 at 4.49 1.png

Pawmates

Strengths

Weaknesses

  • Photo forward with bright, clean design

  • Fast onboarding/profile

  • Onboarding includes some pet information input

  • Unclear on who the user is supposed to be

  • No requirement for user or dog info 

  • Chatting requires a Tinder style match

IMG_5986 1.png
IMG_5988 1.png
IMG_5985 1.png

Takeaways

  • Require pet information input at onboarding

  • Create local community feed to facilitate group planning and act as a general social lubricant

  • Design the app with bright, energizing, and friendly colors

Takeaways

  • Have mandatory dog and owner information input at onboarding

  • Design app for a more diverse user group. Step away from the dating app feel

  • Include both community and direct message communication

2) Defining My Audience

By defining my users, I would start to map out multiple points of view that would be based on user needs and insights. During this stage, I built user personas and user stories.

USER PERSONAS

Group 5 1.png
User Persona 1.png

My goal was to design personas around the unique needs of my users and their dogs. I wanted to design for possible social anxiety issues for Derrick and his dog Bella. With social media hopefully acting as a buffer, making the jump to real-life meetings should be more approachable. Allie and Bean could benefit from the same feature but had possible safety issues to contend with. Requiring mandatory pet and parent information for all new users would aid in meetup safety and compatibility. 

USER STORIES

With all of the data that I'd put together so far, I was ready to define the high-priority user stories. ​

​

As a dog owner, I want to:

So that:

Create and view dog community posts in my area.

I am able to chat with and plan meetups and playdates with other dog owners.

As a dog owner, I want to:

So that:

Create and view listing for dog owner meetups and playdates in my area.

My dog and I have a resource for attending meetups and play dates with other dog owners.

As a dog owner, I want to:

So that:

View detailed information on other dogs and owners.

I know if other dogs and owners are compatible for my attending meetups and playdates with them.

USER FLOW

View and post in local social feed:

 

Group 33750.png

View and post in local social feed:

 

Group 33752.png

View and post in local social feed:

 

Group 33753.png

View and post in local social feed:

 

Group 33751.png

3) Ideate

Based on the insights collected from my user research, I sketched a user story and wireframe. I had become very comfortable with sketching at this point in the program. With the nature of the app, I knew I couldn't pass up the opportunity to get a little wacky. With the word "whimsey" as inspiration, I jumped in!

USER STORY & WIREFRAME SKETCHING

IMG_6002 2 1.png
IMG_6005 3 1.png

DIGITAL WIREFRAME

Per the program's instructions, we were asked to produce a digital wireframe with as much detail as possible before jumping into color and images. You'll find my first draft below. 

Splash

Group 33759.png

Setup

Group 33762.png

Sign In

Group 33760.png

Landing Feed

Group 33763.png

Sign Up

Group 33761.png

Event

Group 33764.png

After some early usability tests, I discovered several opportunities. The first was the lack of "tip" or "how to" frames at onboarding. My users were confused as to what the app could actually do. Furthermore, users were unsure as to how to post new content. To see the updates, click the link below.

VISUAL DESIGN​

As my capstone project, I wanted to make a splash and employ strong visual design choices that spoke to the ecstatic nature of play. Using my local UX community slack channel as a testing ground, I received great feedback on all of my design ideas. After many iterations, I settled on a very joyful:

NAME,  LOGO, STYLE & UI

What is more joyful than a happy dog? You've got it, nothing! After many iterations, I landed on "Waggle" for my app's name. With the well-known schema of a dog wagging its tail equating to happiness, the app now spoke to ideas of both ecstatic joy and action. To reference back to the app's name, I used a dog "wagging" its tail with a paint drop/splash-style backdrop to represent joy and the chaotic yet heartwarming nature of play. In preparation for future frame building, I put together a style tile and UI kit.

Group 33804.png

4) Prototype & Validate

The prototyping phase for Waggle was the biggest UI challenge I had experienced yet. Through multiple rounds of formal and informal user testing Waggle went from functional to pretty fantastic if I say so myself!

CHALLENGE # 1 - ONBOARDING

  • Challenge: After logging in, users were asked: What kind of app does this appear to be? What is its purpose? Users were unclear. 

  • Solution: To fully explain what my app could do, I opted to increase the number of onboarding tip screens from one to three.

Group 33766.png

Iteration #1

Group 33767.png
Group 33768.png
Group 33766.png

Iteration #2

CHALLENGE # 2 - ORGANIZER CONTACT

  • Challenge: While I had worked in an event chat feature - when asked, users were unsure as to how to reach out for additional event information.

  • Solution: This was a great opportunity to include the event organizer's name and a direct contact button.

Group 33770.png

Iteration #1

Group 33769.png

Iteration #2

CHALLENGE # 3 - NAVIGATION & CREATION

  • Challenge: When asked to navigate to their currently booked events users had difficulty finding the right buttons. They had the same issues with creating new social posts and events.

  • Solution: I already knew my navigation needed some work but I was honestly surprised users were having trouble finding the "plus" icon for posts and events. Circling back, I decided to combine multiple page and navigation elements to create a floating static bottom nav. 

Group 33772.png

Iteration #1

Group 33771.png

Iteration #2

Final Deliverables

To date, I have a total of 18 screens with more to come. 

Group 33779.png
Group 33780.png
Group 33777.png
Group 33769.png
Group 33778.png
Group 33775.png

Takeaways

The design of Waggle has been my most challenging and rewarding experience since starting the UX/UI program. The complex needs of my user personas, Derrick and Allie, required significantly more frame and navigation edits than anticipated. While I already had so much respect for aesthetic sketching, I definitely missed an opportunity by not spending more time sketching out the UI's logistics.

​

Far and away, my biggest takeaway was the importance of advocacy in design. The best thing to come out of the pandemic has to be the world's renewed value of social and mental health. I found a lot of pride in designing an application that is accessible and hopefully opens up the accessibility of social opportunities for my user.

Title (3).png
bottom of page