PROMOTIONAL MATERIAL
https://deco3500.github.io/fog/
PROTOTYPE
https://github.com/deco3500/fog/blob/master/prototype/foodle.mp
The prototype of Foodle is located in the prototype folder of the fog repository. The prototype is called foodle.mp and is a mockplus file. This means that to view the prototype with all its interaction features, you will need to download Mockplus (a free software http://www.mockplus.com/download). Once downloaded, open the foodle.mp file in Mockplus and select the login page on the right side of the software. You can then click the play button at the top of the screen. This will start the prototype preview display. You can now interact with the prototype like you would a normal app.
Note: the prototype may not display as intended if the following fonts aren't installed on your computer: Aleo & Quicksand
SUMMARY
Useful and purposeful food news posts on social media do not exist. Readers are simply provided with generic or irrelevant information. Why does a reader who is dieting and located in Brisbane want to see a delicious chocolate milkshake with extra marshmallows, chocolate sauce and snickers made in a café in Melbourne?
Today's communication and planning is enacted through social media. Yet there is no technology that allows friends and family to easily search, plan and communicate food news. Users need a dedicated service that can tailor content to their specific needs and wants, thus, providing users with relevant and ongoing food information.
Foodle is a revolutionary application merging food news with social media to create the ultimate eating guide. User's location is tracked, and their eating likes and dislikes recorded, alerting them to convenient and delicious eateries near them. Friends can tag friends in places to congregate together, or post photos and comments about where they have been. Users can now find the food information they need instantly, rather than random and irrelevant information provided by other services. Foodle will connect people with food and friends, wherever and whenever they are.
PROCESS
RESEARCH
We began our first sprint by researching existing platforms with similarities to our concept. The two main platforms we researched were Facebook and Instagram due to their popularity and current use for food media.
Facebook is a social networking site with its main draw being that a large number of people in our society are active on the site. Users typically post about their life and likes. This creates quick access to details of the lives of other Facebook users. Many Facebook users post where they eat and pictures of the food they eat. However, finding and sharing food you eat isn’t a planned function of Facebook and as such, they don’t have ways of easily searching through food related data.
Instagram is primarily a photo-sharing platform which enables users to find photos through ‘hashtags’. This means easy searching of images users have shared, including food photos but it isn’t primarily based around food. The platform doesn’t allow you to look at food images based on what is closest to your current position which is how Foodle stands apart from this platform.
PAPER PROTOTYPE
Once we had researched the current state of the market, we brainstormed the features and designs we wanted as part of the concept that would make it unique. We decided on a mobile app as a more convenient way for the user to access our product and has the ability to use geolocation.
Next we collated our ideas into a paper prototype of the design. This included two versions of the home page, a favourites page, a settings page, a profile page, and a tables page.
We then designed user testing for the paper prototype. To organise this we wrote a test plan including a consent form for the participants. As we were mostly interested in the design and ease of use, we wrote a questionnaire to walk through the different features and pages of the app. We tested 5 people of ages varying between 19 and 58. We wrote the participants answers to the questionnaire questions in a google form to easily analyse the data.
https://goo.gl/forms/6dkIaw0BTnFd0IJK2
All of the users found the app easy to browse, navigate and understand, and 80% of users preferred the block home page to the map. Some issues arose when users tried to find the settings page as the icons confused them. Otherwise, all users were able to find all the other functions, even though the paper prototype was difficult to visualise for some users. From the user testing is was clear that changes to the functionality of the settings page and home page configuration were required.
LOW-FIDELITY USER TESTING
From the paper prototyping results we designed a low-fidelity prototype using Photoshop that was then implemented using MockPlus. Examples of the designs are below.
We ran five different users through a cognitive walkthrough that allowed them to explore Foodle for themselves. After the walkthrough, a discussion with each user was conducted in which their opinions about the design and implementation of Foodle were recorded.
All the users liked the idea of Foodle, and liked the scroll feature on the home page. Some users liked the idea of having a ‘table’, while some found it ‘cliché’. Regarding functionality, all the users agreed that the favourites page needed to have larger pictures to fill the whole screen and the colour scheme needed to be altered to fit in with the theme of the app. Although most users found the search page aesthetically pleasing and easy to navigate, one user thought the page had too much dark green. Furthermore, the friend’s page was found to be too bland, especially compared to the other pages of the app. Additionally, users commented that the app was too block-like in some places.
HIGH-FIDELITY USER TESTING
We redesigned the app based on the feedback from low-fidelity user testing. This time we focused more on testing the design and specific functionality of the application because of the feedback received in previous iterations. Examples of the designs are below.
For this iteration of testing, we re-tested the users from the paper prototyping session. This enabled us to get an insight from users who had previous experience with Foodle so we could see how the functions had developed. Each user was explored the prototype and was then asked to fill out a questionnaire.
In general, users did not like the design of the application. Many mentioned that they found the non-uniform headings and green accents unappealing. The users were also confused by the layout of the search page and found it difficult to navigate. Additionally, users did not like the abstract layout of the settings page or the profile page. Also, users could not easily identify where they post their own content. Overall, most users suggested that the application needed more unity and simplicity.
FINAL PROTOTYPE
The final prototype was designed based on feedback from the high-fidelity user testing. Once designed, they were implemented into MockPlus. These finals designs were chosen as they are attractive to users. Research suggests that attractive designs encourage positive affects and are more likely to lead to a desired response, which in this case is using Foodle to find their favourite foods and share them with their friends.
PROJECT ROLES
ELLOISE
- User testing of paper prototype
- Documentation of paper prototyping
- Design of low-fidelity prototype
- Created promotional website
- User testing of high-fidelity prototype
- Documentation of high-fidelity prototype
FELICIA
- User testing of paper prototype
- Documentation of paper prototyping
- Implement low-fidelity paper prototype in MockPlus
- Implement high-fidelity prototype in MockPlus
- Design of final prototype
SAMANTHA
- Designed paper prototype
- User testing of low-fidelity prototype
- Documentation of low-fidelity prototype
- Design of high-fidelity prototype
AARON
- Created paper prototype
- User testing of low-fidelity prototype
- Documentation of low-fidelity prototype
- Design of high-fidelity prototype
The Project Plan can be found in the wiki