Funcooker+Final+Report

=Fun Cooker! - Final Report=

Team Members
Matt Orlove - matt at umd dot edu Chris Carmel - chris.carmel at gmail dot com Jen Gorski - jgorski18 at gmail dot com

The Problem
When people first become independent, one of the first difficulties they run into is not knowing how to cook for themselves. Usually, they will start by finding a few simple recipes to make dishes they are used to or ones that include their favorite foods. Cooking different recipes and learning what they like is how people learn to cook. To aid in this learning process, we created a simple recipe site for novice cookers that enables easy sharing, browsing and searching for recipes. While there are plenty of recipe websites currently available, their focus is to expand an experienced cooker’s knowledge and ability. Most of the recipes use advanced techniques, sophisticated ingredients, and are intimidating for people with little cooking experience. In addition to complicated recipes, these websites are over-cluttered and hard to navigate because of the vast amount of information offered to the users. While some of this is helpful, it is not necessary to someone learning to cook and simply looking for recipes to try.

Fun Cooker is a free recipe site that anybody can use, with the focus being on young adults. Users are able to upload and search for recipes as well as interact with each other. Since these are the main features of our site, we concentrated on making sure the tasks were easy to learn and execute. We also made sure that everything centered around recipe sharing and additional features would only enhance the user’s experience. By focusing on what our audience would like to accomplish and making sure they have a positive experience, we have created a site that we are very proud of and could be useful to a lot of people.

Credits
Fun Cooker was created by Chris Carmel, Jen Gorski, and Matt Orlove. Our team worked very well together and for each stage of the process we would discuss what needed to be done and tried to divide the work as evenly as possible. Usually, one person would emerge as the leader because of their individual skill set, but the other members would still contribute. If someone took the lead in a write-up, the other members would proofread and edit. In the coding stage, after someone wrote a web page, the others would edit it and use it as a template to create other pages that were needed. Here is a breakdown of what each member did for each stage:


 * **Proposal:** Chris and Matt came up with the original idea and Matt wrote the proposal.


 * **User Needs:** Jen and Matt interviewed expected users and then the group got together to discuss the results and decide on a task list for our users. For the write up: Jen wrote step one, Expected Users and Initial List of Tasks; Chris wrote step two, Task Validation; and Matt wrote step three, List of Requirements. For the References section, we each wrote about three cooking websites that we knew about.


 * **Design:** For the low-level development step, Chris created prototype A, Jen created prototype B, and Matt created prototype C. After creating our individual designs, we got together and talked about what was successful or not in each design and produced a completely new design to implement. After this, Matt wrote step 3, Reevaluate and Make Decisions, and for step 4, Refined Design, we each wrote about three of our new pages.


 * **Prototype:** Chris wrote the majority of the HTML and Jen and Matt used his pages to create supplemental pages needed for the next stage, the usability test. Matt also wrote the write-up explaining the prototype on the wiki page.


 * **Usability Test:** As a group we decided what tasks were important to have tested and then we each conducted a usability test with at least one person. Matt wrote the majority of the write-up with Chris and Jen writing up their results in the Usability Test Results section. Jen also created the pre-test and post-test and added information about them and the results collected from the post-test and interview.


 * **Project Conclusion:** Chris took on the task of writing a server for our web site using the Google App Engine and Python. He also wrote the majority of the interaction between the server and our website. Matt worked with the HTML and made improvements from the information we learned after conducting our usability test. Jen wrote the final report and both Jen and Matt created the final presentation.

**Audience**
While there are people of all ages that do not know how to cook, we decided to focus on people between the ages of 18 and 25. Not only can we relate to this age range best, this is when most people become independent and would greatly benefit from our site. Since this age range is so accustomed to using websites such as Google, Tumblr, and Twitter, we decided to have a lot of our features emulate theirs. For example, a search bar that functions for multiple types of fields, a strong reliance on tags, and a simple monochromatic design. By doing this, we feel that people in this age range will be able to quickly understand, enjoy, and use Fun Cooker.

**Competitive Solutions**
The internet is filled with websites dedicated to recipes and cooking. To be sure we were creating something different that young adults would want to use, we researched several popular websites. During this process, we decided what was most helpful, what was successful, and what was unnecessary for the site we were creating. Some of these competing websites include:


 * **Cooks.com** ( [|http://www.cooks.com] ): A less sophisticated recipe indexing site. Offers a search bar to search the index, featured recipes, and many navigators to recipes by section. The homepage is jam packed with links to recipes and other destinations in the website, but not much organization seems present, and virtually no images can be found. The website also offers a forum for members to converse about the foods they are making, but the forum is external and is a template to which little to no customization has been made.


 * **Epicurious** ( [|http://www.epicurious.com] ): This site uses tags and pictures to help users easily browse through recipes. It also offers recommendations for users and the ability to comment and rate them. The main aspects of this website include its wide range of recipes as well as articles, videos, and a store. While all of these features aim to help users, the pages are too overcrowded with information.


 * **Food Network** //(// [|http://www.foodnetwork.com] ): The website of the popular television channel. Celebrity chef recipes are shared along with video tutorials and user comments. Offers many helpful tools such as separated sections for special occasions, many sorting options while browsing recipes, and extensive food suggestions. Their vast recipe database is a huge draw, but the inability for users to post their own recipes seems to be ignoring an extremely useful social aspect.


 * **Weight Watchers** ( [] ): An online tool for people trying to lose weight. The layout is very clean and successful and it offers recommendations in a rolling menu so the page is not cluttered. Users can search for recipes based on ingredients and each result features a few quick facts and an image of the prepared dish. However, the site is centered around weight loss and nutrition so it does not focus on recipes alone and a membership fee is required for use.

**Overview of Solution**
Fun Cooker focuses on the needs of people just beginning to cook by making it easy search, browse, and upload recipes. To ensure that the actual website is easy and enjoyable to use, we incorporated features from popular web pages that we find successful. The overall design uses a simple blue color scheme with a consistent layout throughout the different pages. The Fun Cooker banner is always at the top along with a prominent search bar and navigation bar. By having these features be consistent, it gives the site a polished look while highlighting the main content on each page. These features also allow users to easily find the pages they want no matter what page they are currently on.

In order to allow users to search and browse for recipes, we developed a tagging system to describe each recipe. When a user uploads a recipe, the first page asks them to enter basic information describing the dish, including what type of meal it is and the primary ingredients used. From this information, we create tags that are now associated with the recipe they are creating. Users have the ability to “follow” tags which is the same as saying that this is the kind of food or meal they like. Each user’s homepage is populated with recipes based upon the tags they are following. This tagging system turns Fun Cooker into a personalized site that presents the user with new recipes that they will enjoy.

** Login: **


We decided that it is important for users to only have access to the site if they have an account. While the webpage is free, we think that by having users sign up, they will be more likely to participate and upload recipes. Unfortunately, we were unable to include the ability to support multiple users so this page acts more as a filler in our prototype to show the step we would have liked to include.


 * Homepage:**

This is the page that the user will see the most. The links on the right are the tags and users this user is following and describes the recipes that are being shown in the body of the page. These are the most recent uploaded recipes that include at least one of the tags listed on the right or are uploaded by one of the users they are following.


 * Recipe Book**

The user's recipe book includes all of the recipes the user has uploaded and the recipes that they have found and added to to their recipe book. It has a simple layout that focuses on the the images and title of the recipes. It also gives the option to only view the recipes they have uploaded, or the recipes uploaded by other users.


 * Recipe Page:**

The recipe sections off the information about the recipe to easily find what is needed. The basic information describing the dish is all included at the top of the page. Below this section are the materials needed to cook the recipe, including the kitchen supplies and the ingredients used. Below this is the actual procedure for cooking the dish. The final section are comments that users have made about the recipe.


 * Upload - Page 1**

This is just a short page for users to enter simple information about the recipe that we can then use to create tags for the recipe. After pressing continue, the user is taken to the second upload page.


 * Upload - Page 2**

This is the main page used for uploading a recipe. The information entered into the first upload page is automatically filled into the repeated sections on this page. We designed this page to be similar to the actual recipe page so that it was easy to navigate. After the user has entered in all of the information, they are able to preview what the page will look like before submitting the finished page.


 * Region**

The region page is a way to create a sense of community between the users. It is also a resource for users to find new recipes to try. This page includes all of the recipes that people living in this area have uploaded. Below the recipes is a list of users that live in this region.

The settings page is where users can update their profiles and information used as additional search criteria.
 * Settings**


 * Search - Entire Site**

The search bar is one of the main features of our site. After entering a search term, results are sectioned off based on what type of result it is. The tags that include the search term are shown at the top, then the recipes that include the search term as a tag, and finally the users that have similar usernames to the search term are displayed. We have also included the option to limit the search results to only show tags, recipes, or users.


 * User:**

The user page displays the information about the user at the top. Below this is a section including the recipes that they have uploaded. Below the recipes are the users that the user is following and finally the users that are following this user.

**Transition Diagram**


One of the main characteristics of our site is the easy navigation and the ability to get to almost every page from wherever the user currently is, our transition diagram tries to showcase this. The line going through the center displays the path that any of the pages in this line can follow. The links to these pages are included as part of the design at the top of all of the pages. The exceptions to this is the second upload page, the recipe page, and the login page. The second upload page can only be reached from the first upload page because it is a continuation. The recipe page can not be reached from the settings, tutorial, login, and upload pages because there are no recipes displayed on this page. Finally, every page can reach the login page by logging out, but the login page takes the user to the homepage only.

**Tutorial Provided**


Our site has a help page that describes the basic features of our site. It can be accessed on every page from the footer. We did not feel that we needed to include a lot of information because we made sure that our website was as easy as possible to use. This is just to ensure that if someone is confused about a feature, they have somewhere to look.

Running the Study
Our usability test was made up of three parts: a pre-test, a task list for the user to complete, and a post-test. When we met with a participant, we had two screens open, the login page to our site and the usability test page ( Fun Cooker Usability Study ). After giving a brief introduction of our site, describing our goals and the main features, we asked the member to fill out the pre-test that was open on the usability test page. The pre-test was used to find out basic information about the user such as their age, the number of hours they spend on the internet, and how often they use the internet to find recipes. This information was collected to help us understand what kind of users excelled at using our site. After the user was finished with the pre-test, the next page described a list of tasks comprised of the main actions we would like users to easily complete while using our website. These were:

1. Create account. 2. Upload recipe. 3. Find a tag and follow it. 4. Find a user and follow them. 5. Find a recipe and add it to your Recipe Book.

Once these tasks were completed, the final page on the usability test page was a post-test. For most of the questions we used a Linkert scale of 1-7, 1 being very easy, and 7 being very difficult. These questions were on the ease of uploading a recipe, searching for a tag, and using Fun Cooker in general. Since aesthetics are important when creating a website, we also asked how they felt about the design of the website. Finally, we included two open ended questions to find out what they found difficult about the site and what they would improve. This allowed us to hear ideas and improvements that we had not thought of.

Results
We had a total of five people participate in our usability study. All of the participants were University of Maryland students between the ages of 19 and 25. Four of the participants used the internet between 10-20 hours a week, the fifth only used the internet between 5-10 hours a week. Three of the participants were amateur recipe website users, meaning they have used a recipe website less then 5 times in the past. The remaining two participants were intermediate recipe website users, meaning they use a recipe website a few times a year. All of our participants ran into different problems throughout the test. The main problems we discovered needed addressed were:


 * Fixing small errors that will improve functionality, for example, making "+ Recipe Book" a clickable link
 * Allowing the "Enter" key to be pressed in our search bars instead of having to click the button
 * Improving search results to help users easily locate the recipe, user, or tag that they are looking
 * Optimizing the upload procedure, we want to encourage users to post their recipes so this process should be as simple as possible.
 * Adding more explanations to buttons and links to aid in navigation, such as changing "add more" to "add more ingredients"

While we were unable to address every problem that users encountered, here are some of the things we improved in our final prototype:


 * Made "+ Recipe Book" a clickable link and fix other small errors discovered in our HTML code
 * Added search options to limit the results and help the user easily find what they are looking for
 * Simplified the upload procedure as much as we could by reducing the amount of information they manually had to enter, for example, adding a picture for each step in the procedure
 * Added more explanations to buttons and links and rearranged some of their placement to aid in navigation.

**Open Issues and Future Work**
We were unable to include all of the features we would have liked because of time constraints. If we were to continue working on this project, the first thing we would need to add is the ability to create an account and be able to support all of the different users. Once we switched to writing our own server, our main focus was creating a functional site for one user. While we were able to accomplish this, we ran out of time to take the website to the next step. Another main feature that we were unable to include was the ability to enter multiple ingredients to find a recipe. Even though you have the ability to search for a recipe including one ingredient, we were hoping to give more options to the users. Most of the functionality we had to leave out are along the same lines as this searching option. Our main goal was to create a recipe site that would quickly and easily find recipes that the user would like to cook. Some of our ideas included removing recipes from search options if the user did not have the cooking materials required and giving suggestions based on recipes in their recipe book. While we were unable to include all of the functionality we had thought of, we were able to successfully create a website that young adults would benefit from.