Prototyping.... Low Fidelity to High Fidelity ... Evolution

Prototyping

My involvement here now focus's heavily on implementing the features and changes into the prototype as well as some user testing and feedback from peers.

The Prototype tool used was Fluidui.com

Here is the Macro view of the application at it was presented in Hi-Fi to our class.

The picture above scales and reduces line clutter of the links when zoomed out. The  technical feature tracking of this application prototype was quite difficult and required experience managing.

Working through the feature sets and updating change logs allowed me to track changes and functionality.

How the app changed...

Colour styling... 

Changes made to the app due to my feedback from my user testing:

- Removed Social title from main page due to confusion that it would present the ability to chat and tag people at a location. Left the icon and cleaned up interface to allow user to discover what the button did rather than give them a pre-conceived idea of what it did.
- Added User location dot to maps to show where they were in relation to the venues.

- Added persistent user information bar on all screens to show progress and current points to the user
- Cleared up how the user was notified on how they acquired points and presented user with fanfair award each time they left a review... delighter feel good happy time
- Separated Average review star score from business profile page... double reference on a page which had the breakdown average stars was more relevant than the overall star average on the business profile page.
- Combined rewards on Business page for easier grouping of 'what you get' and 'what discounts are available'.
- Aimed for upgrading screen animations between slides for consistency in swipes. Gestures aren't extensively used so I cleaned up the pop up alerts to flash in/out rather than pop in/out... made interface feel more snappy and express.
- Added the ability for business and users to add photos to the review or business owner page.
- Added the Business owner page to create and manage their business profile under settings in the user page.
- Added pull down template for tiered discount management. Alpha prototype only and updates will require team review.
- Added comments and thumbs up/down for fast review verification by user. This was requested because not everyone will want to read all the reviews but would rather gauge good and bad by the number of thumbs up and down it got.
- Added option to enable/disable auto share of experience to social media when finishing the review submission.
- Added the ability to manually add a business not found in the database. This now allows for simple webpage enter and name with style and the backend database will create a temporary business profile and reserve the name for the business owner to reply and take ownership via joining the app in the secure email notification sent to the business.
- Added User review notifications in the user profile notifications page. This allows owners to get direct access to the review on their business and allow them to comment or offer personal discounts later.
- Cleaned up interface and made the colour scheme more "social blue" ala facebook... users much happier at this change when presented with the optional colour schemes.
- Added Discounts to main page and separate pages for News and Discounts upon clicks...

+more....  359 iterations of this app went through compiliation, review and visual testing. 3 versions went through 3rd party testing in my household with additional feedback from my group peers via facebook group.

  

Gui and Application concept designs.

 

Gui and Application Concepts

 Here are the initial GUI and application layout concepts... 

  

 

The basic layout kept all the features in check. We were happy with the layout, but with each team member introducing new features to their portion of the application, we began to experience the dreaded 'feature creep'.

The evolution of the app occurred much faster once the prototype tool was employed and iterations came faster than they could be documented by pencil in the visual diary.

During the prototype and final presentation of Foodle, I personally made 359 iterations(!) of the app which are archived in fluidui.com 

By the time the first practice presentation came around, I had implemented the majority of the features in a very functional low definition prototype. Below are some screenshots showing how the application looked in our very early prototype.

 

Midpoint changes here were occurring due to feedback delivered other team members private and user testing.

 

The lack of features and functionality (even though it was a prototype) which worked were the largest drivers for content and change in the next round of updates to the gui.

Template email form for new Businesses

The Business Contact email

The below picture shows how I imagined our app would be able to contact a business owner through a user manually adding (now a feature of the prototype) a business to the database.

Adding a new business which is not yet in the database is simple. Via the search menu, if the venue you want didn't show up, or you are at somewhere which isn't in the database to leave a review. Click on the +Add button and enter as much information as you can about the venue. 

Adding a new business could be as simple as asking the venue what their website address is or a google search and entering it into the new business profile page below. 

I vision that this would create a temporary profile which reserves the name of the cafe for the business owner to take ownership of. Our system backend would visit the website, scrape the information such as opening hours, locations, phone numbers, email details etc. 

At this point, we would create a personalised email link for the owner of the business via the 'contact us' page on their website. In this email we would have the reserved account ready for a secure link to be clicked to activate and provide additional information if needed by the owner. 

The business owner can assign discounts to user ranking (CP's) and rewards given for reviews as well as amend any other information associated with the account.

The owner can also receive alerts on reviews submitted, see reviews and even comment on them.

This is how we will bring the businesses into the community and connect them with their customers

Storyboard time...

How would our users interact with our app

I developed a few scenarios of how our potential user would fit our App into their everyday life.

My first prototype was very simple... "Lets go out for dinner?"

A couple decide on what they are going to do for dinner that night. They feel like going out and this is how I vision they would achieve this through my app.

 

A Couple experiencing a review Critic Point tier upgrade and earning new discount perks... very exciting!

This design for our story board proved quite popular and hence then I decided to refine and expand on this with additional scenarios to show how a user will find other features of our app useful and easy to use.

Searching Storyboard

Review Storyboard

Rewards Storyboard

It was at this point the team identified the 4 key area's for initial iteration and prototyping was needed.

• Searching/results (Chris)
• Reviews/Business Profiles (Peter)
• Social/Following/Personal (Nicoletta)
• Review/Rewards/App Prototype (Mark)

The team split for the next week and each working and collaborating ideas through the facebook DC 2 group. 

 

The Business Model

The Business Model

Having some previous project management experience, and especially with working with stakeholders. I developed a small business model to clearly show how the process was going to work.

I identified that the 3 key players needed in this applications success would be:

• Users
• Businesses
• Developer (me, and the team)

This Business model clearly shows what the key features are needed and some of the delighter features. Which party is contributing what, and what they are getting in return. 

This is what I called the User Experience Loop Model.

 As you can see, there is a feature and a gain for everyone and a self regulating reviewing system whereby the content is created, uploaded and moderated by the Users and the Businesses. 

A good place to start I thought. 

My physical reflective diary entry below.

Defining the Users (Target Audience) and the Gap in the experience

Defining the User

My work defining the user was largely attributed to my own experience looking for a good food outlet with reliable reviews. I mentioned this in a previous post where I could not get decent or reliable information on a particular cafe easily, and that information I got was clearly tampered with.

So what did I want in an app like this? Seems like a good starting point, right?

• I wanted reliable reviews. I don't want to be reading annonymous submissions on a google review page where the information could have well been posted by a competitor cafe. The owner of the cafe I was sitting in must have been oblivious that this content about their restaurant was online and unchallenged... 
• Not so important to me, but possibly others. Searching for restaurants. If your new to an area or just up for something new...
• News... is there something special happening at a place I go to often?
• Discounts... and I want to know when the specials are on. I never eat anywhere at full price. (I'm cheap that way)
• Menu's... if I look up a place... I really REALLY want to see a menu before being the guy to sit down... the waiter hands me a menu... and after 30 seconds of looking at whats on offer... "nah, I don't like anything on the menu" and getting up infront of other patrons and walking out. If it's not my style.. I want to know that before walking in.

Now I'll be honest. I'm not the foodie kinda of person, in fact my personal taste in food is quite limited and as a child thought that eating dinner was something that got in the way of my play time. 

That said however... I am fascinated by those people who LOVE food and claim that food and dining is their life. 

Lets take a moment to look at how food has played a role in media, social and digital lifestyles in recent years. It wasn't that long ago, Daytime television would have the Cooking shows and prime time would be the Game Shows. But a very quick look today would show a very different result. Prime time television and big business now heavily favour the My Kitchen Rules, MasterChef's, Bake offs and the likes. Game shows are pushed to space fillers between other prime drama and yet more cooking shows! Heck, even my 3 yro niece stays up late to watch My Kitchen Rules? 

When did this happen? When did eating become big business when only a few years earlier, "not eating" and weight loss competitions were the thing to watch....

Social media happened. There was always a market for people who love food. But rarely a voice given to them. Until facebook and instagram that was. The first time I noticed this was when the mass of selfish selfies on my facebook timeline were quickly being overtaken by pictures of someone's dinner...? Really??? ... your dinner? 

Photo's of a steak, photo's of a seafood platter, photo's of ... 
... well you get the idea... The point is though... People loved food! and people love telling other people about food!

A quick google search found that this wasn't just something people did to annoy me... but it was actually some new craze taking off on the internet! 

http://eater.com/archives/2013/06/26/restaurants-encouraging-diners-to-take-photos-of-their-food.php 

http://www.buzzfeed.com/mackenziekruvant/food-instagrams-to-follow-in-2014

People follow this kind of thing online... So much so that the terms "Food Porn" and "Food papperazzi" have been coined... Even parodies of this cultural development....

iPhone 5 for food photography...

Okay... so I think I have a good grasp on who I may want to target with this... I have a list of my wants and needs... I have a demographic I think will love an app platform especially targeted at them. 

How do I think I can get these people to use my app?  The Gap!

Give them something that isn't on offer with the service they are already getting! Facebook has the problem that when posting 'Food Porn' online annoys friends who aren't into the food culture. Instagram doesn't have the social breadth that facebook has. And neither allow automatic alert of the businesses being reviewed or take part in the conversation. The food lover doesn't have a real home yet... and everyone likes to feel like they belong!

So what will we do to make the user feel like they belong?

Connect them to others who share the same love of food. A small scale social network where you can follow community reviewer's experiences and try those dining recommendations themselves.

Leave and Comment on reviews. Participate and become known as a respected local, national or even global food critic.

How will we tempt users to contribute to the community and in turn their experience?

Rankings and Rewards... Everyone loves to be recognised for a contribution... almost as much as they love being rewarded for doing so.

Rankings: Lets allow users to gather points. Something that can be acquired and used to show how their reviews can be trusted and something to feel proud of. I came up with the Critic Points (CP) system. A system where by the user gets points for leaving a review, more points for updating reviews, and even more points if people 'like' that review!

Rewards: Everyone loves free stuff... Cafe's and Restaurants already offer discount vouchers and loyalty cards... The Critic Points system is a way for a Businesses to advertise and share discount offers to users directly. But I'll touch on this idea a little more later.  

Team setup, dynamics and basic feature set...

As highlighted in the last post. Our group choice was APP # 3 Foodle.

The reason for this was that it had a really well definable market and user gap which to our research extent, was not being full filled by any single application.

Naturally, with a new group, we were still coming to terms with our roles in the project and identifying peoples strengths and weaknesses. This really took the most of the first week and battling a very hectic schedule by all. We still managed to make time for meetings. A stark difference to my previous experiences and very welcomed.

Nicoletta (The arty' one), has happily positioned herself as the artist and creative interface designer claiming much photoshop knowledge and experience.

Cris,  has been quiet but contributing well. Later on in the project, his confidence levels rose to allow him to be quite an excellent contributer also.

Peter, polite to a fault. Has been providing some excellent ideas for scope in the various feature sets we'd been discussing and was very happy to take on his role. 

All in all, very happy with the group's enthusiasm to take on a challenge.

Very quickly I found myself in a position where even though the app idea was my own, I had the respect and assistance of the group to split the work evenly and contribute. 

Feature Set

The features of the app are often determined initially by the needs of the app. For example, we identified that the Foodle App would need the following basic satisfier's :

• Searching and finding cafe/restaurants
• Reliable scoring and reviews of those businesses
• A reason to make using this app beneficial to the user
• A reason to make the user contribute to the app
• A reason for business to support the app and the user.

With this basic feature set. We could begin to refine what we could do, how we could do it, and how we could offer more than our competitor apps... But before we directly tackled the competition, We needed to assess the User wants....