Beautiful Bulldog App
The audience for the Beautiful Bulldog Contest at Drake University is students, alumni, and other interested members of the public. There are around 3,000 spectators that attend the event every year (you can read more about the event here. It’s a lot of fun, I actually attended the event a few years back!). The App Design & Development class at Drake was asked to create an app for this event, and the class presented final designs to the marketing department to incorporate into the very first version of the app that’s being developed!
The contestants are chosen for the contest based on judge votes, but the contest organizers want to start promoting contest attendees to participate in the voting process. In theory, this idea will drive traffic to the event by giving audience members a say in the voting process, and an element of participation within the event.
To create an app the Beautiful Bulldog’s audience will find useful and easily navigable. The interface should feel familiar so that the users don’t have a lengthy onboarding process.
Another goal of this app was to create audience traffic overall of the Beautiful Bulldog Event. For this reason, social media accounts were incorporated throughout the app to generate buzz online. By following the contestant’s accounts leading up to the event, audience members get the opportunity to learn more about the personalities of the contestants before they have to cast their votes.
This project would be the first time I created low-fidelity wireframes that lay out the basic content involved on the app pages.
For this project I was instructed to make a mobile app using Adobe XD for my App Design class at Drake. We were constrained to using only what could be animated through the app, auto-animation features in XD.
This project was a part of my App Design class at Drake University. I used Adobe XD for the prototype, because this was an easy way to test with users. The XD mobile app provided a convenient way to test the project with a real set of users and get their feedback on the app.
For this project I conducted User Research based on the demographic for the Beautiful Bulldog Contest and asked them to perform a few tasks.
Create a profile and add a dog as a contestant
Vote for a dog and view the results
Check the results to see what dog is in first place.
Changes based on user feedback:
Users didn’t know they had to scroll down to click continue to register a bulldog. This was a simple fix because the button was off screen and had too much white space, so it did not seem scrollable to the user.
Verbiage was unclear when selecting to register a bulldog, could be clearer.
Add livestream at the bottom of the results page. Was a bit hard to find at first.
The hierarchy of the card design was something else that was improved based on user feedback. On the first version (left), it’s unclear where the eye is drawn to first. Should it go to the number of votes? The photo? The contestant’s name?
The second version (right) improved on this by having the hierarchy of information on the card as: Placement --> Contestant Name --> Contestant Photo --> Number of Votes. The second revision is also much more condensed and easily scannable, which is important if there will be a large quantity of contestants displayed.
During the development of this mobile app project, I learned how truly important getting real users to test your product is. You can’t really tell how someone will interact with an interface until you get real subjects to sit down and try to perform a task on an app.
First, we have the onboarding process of the app. The way I broke up the user was by contestants and attendees of the event. After they provide a name, password, and email, they are either taken directly to the contestant page or to more onboarding if they are registering a dog for the event. Some information included would be: interesting facts about the dog, where their owner is from, and any social media pages their owner provides for the app. This allowed for immersion outside the app so that the attendees could follow the dogs leading up to the event.
The contestant each has their own bio in the app, which includes interesting facts about them, photos/videos, and social media their owner provides during the onboarding phase. The goal with this design was to stick with the card design used throughout the app, in the form of a toast popup. This gave the impression that the user is on one continuous screen, and the immersion is not being broken throughout the discovery process of each contestant.
Once the user enters the voting process, they are unable to ‘take back’ their vote for a contestant. They may see where their dog is placed overall in the event, but they may not vote again unless they provide a new account to vote from. After this, the user is brought to the Results tab where a live placement of each contestant in the event is shown.
Based on the research done through the user testing phase, incorporating social media into the event led to interest over time being maintained in the app. Through this process, I learned that something that seems so simple within an app is actually very complex. It’s important when in the ideation phase to make a developmental timeline of how long each feature would take before moving on to the design phase of the project.