Cook & Eat Together — Paper prototype

We are Xinrui, Elif and Guo. Today, we want to introduce the non-functional prototype of our App, Cook & Eat Together. First, we would like to introduce the navigation design; then, we use a video to show the dynamic functions of our app; later, we will introduce the interaction design; at last, we will show you the database.

Navigation design, each rectangle is a page.

At the very beginning, we would like to show you our navigation design.

“Current Event” list shows all available public events in a renewable list. “Event detail” contains all details about the selected event. The user can go to this page from three previous page: current event list, joined event, and invitation. “Joined Event” is a list stored all events the user plans to join. If you receive a invitation to attend a particular event,the event will be added to “Invitation” page. “Created Event” stores all events created by the user. The user can edit, publish, delete and save as draft in “Created Event Detail” page.


Information & interaction design

Current Event

In our app, the most important concept is event. Here, we would like to introduce our information and interaction designs, which related to event.

“Current Event”

“Current event” list page includes all public events, which are sorted by time and location. We also plan to use data mining algorithm on the function of event sorting in our further work.




My event


“My Event”

We have designed the page,”My Event”. In this page, there are three buttons, Create Event, Invitation and Created Event, which link to pages “Create Event”, “Invitation” and “Created Event” respectively. Users can easily check events related to them from this design.



“Create Event”

In this page, users can create their own public or private event. The unique design in this page is “requirement”, where event owner can write down his or her requirements. When the owner press the plus button, a pop-up list will be shown. Then, the owner can write down what (s)he want. After having entered all the necessary information of the event, the owner can choose to publish directly or save as draft. Also, the owner can press “cancel”, if (s)he want to cancel it.

Event detail


“Event Detail”

The detailed information of event will be shown in the page, “Event Detail”, . And users can go to this page from “Invitation” page, “Current Event” page, and “Created Event” page. On “Event Details” page, we add the buttons, “join” and “invite friend”, both at the top and the bottom. Users  can join the event before or after reading the event introduction. Moreover, when the user presses the “join” button, a pop-up list will show up, which contains all requirements written by the owner, such as wine, vegetables, soft drinks or flowers. The participant can select one or more of them to show his or her formality, or choose “none”. If user press “Invite friend”, (s)he can invite friends in his or her friend list to join the event. Furthermore, all participants’ avatar will be shown in this page. If the user wants to become friends with one of the participants, the user can press the avatar and go to the user’s profile, then press the add friends button. We do not provide powerful functions to the user to build their social network. Our concept of this app is that we expect users can establish strong connection between each other both online and offline through the app.  We consider that the strength of the relationship is more important than the size of the social network. We hope that users can build their social network with strong relationship via this app.

Simulations of dynamic functions

Now, we would like to provide a prototype video. In this video, you can exactly see how the above pages “working”.

You can see how users Sign up and Join event, Log in and Create event, and Invite friend.


Here, we would like to introduce what data the database stores. In order to make the answer clearer, we have created 5 tables for our database, “user” and “event” are info tables, and “friend”, “invitation” and “attending” are relation tables.


“UserID” is the unique number that the system allots to the user after the user is registered.


“ParticipateNo.” is the max number of the participants that can join to the event. “JoinNo.” is the number of how many users have pressed the “join” button for a specific event. “Requirement” includes the stuff that the owner requires participants to bring to the event.


Attending table “Attending” is a relation table, which stores the relationships between the user and the event. It is a binomial relation table, which means that each element in this table represents the relationship  between one participant and one event.


“OwnerID” refers to the user who creates the event, and “userID” refers to the participant. “Requirement” refers to the stuff that the participant selected. “Number” is how many stuff the participant needs to bring. “UserID_1” is the user who sends the invitation. “UserID_2” is the user who receives the invitation. “Status” includes 2 variables: join and decline.


Friends table contains the relationship between two users.

Thanks for reading!

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s