GoalGether: Goals, Others and You

Needfinding to interactive prototype and the many iterations in between.

Andrea Boyes
6 min readNov 21, 2016

Fascinated by the psychology behind information overload and how it is impacting our productivity I chose the theme “change” for the UC, San Diego Interaction Design certificate Capstone Project . Are people able to set goals, remain productive and get things done while facing the lure of technology? Can our devices be harnessed to help us? And so began my journey.

What do users need?

As a needfinding exercise, three participants were tasked with setting a goal for the day and tracking the number of times they checked their phones (Checky app was used). Participants were then interviewed about the impact of information overload on productivity evident by the factors that improve or detract from the ability to meet a goal. Two of the three users were successful and they attributed it to having to report their progress for the project. The participant who did not achieve their goal felt that sharing it with others would have helped them succeed.

Several major design opportunities were identified:

Goal setting and achievement needs to be as much fun and social as using apps like Facebook and texting.

Sharing goals with others improves success.

Users need to feel that they are being monitored and thus held accountable in reaching their goals.

A constant visual reminder is needed to help users remember and achieve their goals.

Ideation

Based on the needfinding results a point of view strategy was created to guide brainstorming:

Make goal management and achievement as much fun as playing games and using social media. Make goals public and share them with peers so achievement is more likely due to accountability.

For inspiration I reviewed productivity apps on the market which ranged from gamification of goals with users working together to slay goals in the form of monsters to an app where users lost money if they didn’t meet their goals. The non-tech Action Circle method was also reviewed where people regularly meet in person to share and commit to goals.

Initially I came up with two ideas:

A bug squishing game where a bug represents a goal to be squished (achieved) and is linked to a gift wish list.

A tech version of the Action Circle that allows people to set goals and meet with groups in person and keeps people connected in between meetings.

After storyboarding and user testing paper prototypes I built for both ideas, I opted to pursue the in person group meeting idea primarily because I thought the bug game would be too difficult to execute; I don’t have access to a team of game developers after all.

Storyboarding

I created a storyboard to quickly show how my design idea works and how it addresses the point of view. A simple cartoon is stronger than words and results in buy-in from stakeholders.

Storyboard for the design idea after needfinding and ideation.

Paper Prototype

Now it was time to think about user flow and put the main user interface concepts quickly in paper prototype form for two users to test and identify heuristic violations. I needed to find out, is this intuitive?

Paper prototype tested to determine if users found it intuitive.

Wireframe

The paper prototype tests identified some major weaknesses. One user found the screen showing results for groups accepting new members to be too cluttered and he didn’t notice the themes. He also wanted more information about particular action circles. A wireframe of the screen was created to resolve these issues.

Wireframe

Interactive Prototype

I found the next step, developing an interactive prototype, to be the biggest challenge. I had never used a prototyping tool and being a visual person I needed a map to plan out the screens and how they interact. I sketched a flow chart to serve as a guide.

Flow chart to provide a rough map for the prototype

A detailed development plan was also created to track all the tasks and set deadlines. Axure was used to build the prototype.

The first version of the interactive prototype eliminated the heuristic problems identified in the paper prototype tests. I then proceeded to perform in person tests of the prototype to identify design breakdowns and further refine the prototype in preparation for online A/B testing. One user pointed out there were no options to edit a current goal and a goal could be marked complete in error. I picked up a marker and paper to quickly design a solution.

Design breakdown: no error recovery. In the first version a user could mark a goal complete in error. The next iteration included a drop down menu offering users options when they click on a current goal.

A/B Testing

A/B Testing: screen A on the left, screen B on the right.

Students were provided with four users for the UserTesting platform to perform A/B testing of their prototypes. My earlier in person tests revealed that some users were confused about the suggested goals on the add goals screen and how to integrate them so I created A and B screen designs to test. There was no significant difference so I decided to keep the screen that was more aesthetically pleasing since all users gave my overall prototype a rating of 3 or lower out of 5 on attractiveness.

These test results provided me with a list of revisions for the next iteration but most surprising was that three out of the four users stated they would not be comfortable using the app to connect with people citing concerns about meeting strangers in person and sharing personal information.

This presented a design opportunity to integrate social media and the users’ friends to create their own private groups. I also changed the name of the app from Action Circle to GoalGether.

Another design opportunity: online testing showed users were not comfortable using the app to connect with people citing concerns about safety, privacy and meeting strangers
Iteration after online testing: users have the option to create their own private group and invite friends so they will be comfortable using GoalGether to connect with others.

Final Prototype

The final GoalGether prototype for the project addresses the design breakdowns and opportunities that were identified through testing. I also created a promotional cartoon that features GoalGether’s interface and how it helps users achieve their goals in a fun way.

What’s Next?

Some visual design work is needed to make GoalGether more aesthetically pleasing and it needs some functionality to make it more socially interactive such as a discussion board and the ability to view members’ goals.

I have come out of this a design thinker with the skills and knowledge to go from needfinding to an interactive prototype with the many iterations in between.

--

--

Andrea Boyes
0 Followers

Curious about the crossroads of social sciences, humanities and technology.