Challenge Summary
Welcome to the "Campus - Lunch Application Mobile Design Challenge". In this challenge we are looking for the [topcoder] community to help us design our new mobile Lunch (Yes, Lunch!) application look and feel. We are providing wireframes that help illustrate and explain how we think the Lunch mobile application should work... we are looking for your to help design the best interface for our mobile Lunch application!
Good luck - let us know if you have any questions!
Round 1
For Checkpoint review, please provides the following screens for client review
01 - Splash Screen
03 - Dashboard Screen
05 - Filter Screen
07 - Create Group Screen
09 - Group Details
11 - View Order and Payment Status
Make sure to number your screens in the order to be viewed (01, 02, 03, 04 etc)
Round 2
All requirements as stated in challenge details with client feedback applied
Challenge Details
There are many great applications that currenlty exist for delivery and takeout if you are ordering for yourself (e.g. GrubHub, Yelp, UrbanSpoon). However, no solutions appear to exist for people who want to order as a group. Furthermore, group ordering may push restaurants to want to deliver (they get paid more). Group ordering is common among coworkers.
Our mobile application aims to provide a solution for delivery/takeout on an individual and group level by taking advantage of existing restaurant searching/menu/ordering applications, electronic payment apps, and then incorporating these existing solutions into our applications "group" system.
In this challenge, we are looking for a visually appealing, easy to use mobile application screens that supports the requirements listed in this challenge.
Design Consideration:
- Create it for iPhone 5 Portrait orientation (640 x 1136 resolution 326 ppi)
Application Theme
We have tentatively titled the application "Doggy Bag". While the application is for ordering lunch, we think incorporating a cute dog-related theme could increase the appeal, through using dog-related words and puns. Of course, if you (the [topcoder] design community has your own creative ideas for a theme, we do not want to restrict you! It's a possible starting place.
Requested Screens
The following are the minimum required screens, keep in mind that we are open to changing the flows adding/removing screens as you (the designer) think is needed as long as the overall requirements are met.
Wireframes:
URL reference
Also see the Downloads
1. Splash Screen
Wireframe references page 4
- This page design needs to be clean and interesting
- Simple logo? Big text headline? Any concept that will help with branding the application.
- By default, this screen will appear first when the application being launched.
2. Login Screen
Wireframe references page 5
- Login will be using IBM intranet credentials (for now!)
- Any chance for create dynamic layout (login from different account? social media for example, fb? twitter? LinkedIn? etc?)
- Ordinary layout elements like username, password, remember me? how about header, footer?
3. Dashboard (group/food/status)
Wireframe references page 6 - 8
- This screen will be appear once user has logged in to their account.
- If user not joined any group yet, they can explore any group or food category in the dashboard.
- If user has joined any group, they will be able to see their group status (screen 11)
4. Search Result Screen
Wireframe references page 9
- User can search any group/food from search section in the dashboard.
- Search result will be appear as list in different screen.
- The search result might showed many results.
5. Filter Screen
Wireframe references page 10
- User can filter and sorting all group/food search result based on several criteria.
- What shown in wireframes is the basic sorting/filter criteria needed, if you have more, please provide it!
6. View Group Activities
Wireframe references page 11
- User can view group activities.
7. Create Group
Wireframe references page 12 - 15
- User can create new group if he/she can't find the right group to joined.
- When create group, user must select any restaurant from 3rd party integration (yelp, etc).
- User also needs to set up the time limit, maximum members, pick up location and others information necessary for the group.
- Right now, all group is public. how about offers some concept for private group? ideas??
8. Edit Group
Wireframe reference page 16
- Any form elements in the group is editable.
9. Group details
Wireframe references page 17 - 18
- Once group creation is done, user can see any details about group.
- User also can see details from any other groups if they want to (from dashboard, group/food list).
- If user not joined the group, they will only see public information regarding the group. they will also see button to join the group.
- Once user joined the group, he/she will be able to place an order in the group (as long time limit still available and not ends).
10. Place new order
Wireframe references page 19 - 21
- Group member can place new order in the group as long time limit still ticking and not ends (page 18)
- Group member will enter their order in new screen (page 19), besides textbox/textarea to input order, group member also needs some ability to see menus selection in the restaurant.
- Once order is submitted, there will be some notification/receipt regarding group member order, restaurant name and information regarding order payment.
11. View order and payment status
Wireframe references page 22 - 23
- User can check/see his/her order in status tab in dashboard.
- Any ideas to provide payment scenario here? Maybe using Venmo integration (for electronic payments)
12. Submit order
Wireframe references page 24 - 26.
- Once time limit to set an order finished, group leader will be able to see all orders in the group (page 25).
- Group leader will be able to connect with the restaurant (via phone like shown in wireframes, maybe via delivery site? any other ideas?)
- After order being submitted, there will be some order confirmation screen appear (page 26)
13. Update order status
Wireframe references page 27 - 28
14. Menu
Wireframe references page 29
15. About
Wireframe referecens page 30
16. Optional Screen thoughts
- Facebook/Linkedin integration
- Food type preferences
- Favoriting of restaurants
Target Audience
- At first this application will be used for internal employee looking to make arrangement for lunch
Judging Criteria
- How well you design our new Lunch application and interpret the provided wireframes
- Cleanliness of your graphics and design.
- Design and User Experience.
Submission & Source Files
Preview Image
Create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Please upload PNG images in a zip file with all requested contest requirements stated above. Number your files (01, 02, 03, etc) this will help review them in order.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop or Illustrator and saved as layered PSD/AI files.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics, images (sizes or colors) or modify overall colors
Please read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. It is important that you monitor any updates provided by the client or Studio Admins in the forums. Please post any questions you might have for the client in the forums.