Challenge Summary
Welcome to the Mnemosyne Mobile Design Challenge!
Mnemosyne needs your help designing a hybrid app that will aggregate content from multiple sources and display it in a manner inspired by FlipBoard (an iOS & Android app - please Install, if you are not familiar with it).
The app needs to be designed keeping in mind it will be deployed on both iOS and Android on phone and tablets
There are 8 screens that need to be designed, and in the first round you need to focus on Tablets only.
We are looking forward to see your submissions!
Round 1
For Round 1 we require 6 out of 8 screens in both Portrait and Landscape for Tablet at 768x1024px / 1024x768px size, in RGB Mode at 72 pixels per inch resolution
02 - Homepage
03 - Category Items
04 - News/Item details
06 - Menu->Interests Page
07 - Menu->Custom Feed Page
08 - From 06->Social Feeds
Round 2
For Round 2 we the final design for all screens + phone version of the screens in Portrait only at 640x960px size, in RGB Mode at 72 pixels per inch resolution
As mentioned the client likes the Flipboard app, but we don't want is a carbon copy of Flipboard. We want to focus on some of the key parts of that application:
- Interactions - The customer loves how you can turn the page, and loves the effect in the app.
- Tiles - Tiles on the home page will represent categories. Each social network will have it's own tile to access that content. When viewing Social content it would be nice to have social network specific views (Facebook shows Likes and Comments, Twitter has Favorite and Retweet, etc.)
- Content Display - This is the other big area. They really like how Flipboard has a "magazine layout" where some articles show snippets, some are just pictures, and others can just be headlines.
The application will be built using HTML5 for both Android and iOS, and we require one "set" of designs that will work for all mobile devices. (Round 1 Tablet, Round 2 Both Tablet and Phone (Phone in Portrait only!))
All graphics must be in VECTOR/SHAPE format in order to be adaptable to different resolutions.
Screens must be designed in:
- for Round 1 - Portrait and Landscape format at 768x1024px (iPad Standard) tablet resolution
- for Round 2 - Portrait format at 640x960px phone resolution (plus update screens from Round 1 of course.)
You must design the following screens:
01 - Splash screen
02 - Homepage
03 - Category Items
04 - News/Item details
05 - Share popup
06 - Menu->Interests Page
07 - Menu->Custom Feed Page
08 - From 06->Social Feeds
The UX should mimic what FlipBoard has implemented.
01 - Splash screen
- Keep it simple - Logo (not provided - use dummy) + Background
02 - Homepage
-Filters
- Display Categories (Mosaic View as in the reference FlipBoard app)
- Category filter - No longer needed
-Items/news/Categories displayed in a Mosaic View
-MENU - To Read|Favs|Interests|Custom Feed - this will be visible throughout the pages.
03 - Category Items
- List of items/news/articles/videos inside the category (Similar to the reference FlipBoard app)
- Sort by latest, top viewed, top rated, top commented
04 - News/Item details
- Image/video
- Options:
- Read Later/Fav/Share/Subscribe
- Title/Category/Date
- Rate/like/dislike
- Write Comment/Record voice comment(hold to record?) - Voice comment is no longer needed
- Comment List
05 - Share popup
Share options:
- Facebook
- Twitter
- Youtube
- LinkedIn
- Email
06 - Menu->Interests Page
- Need to have the ability to add user's own RSS feed category - for example "Gaming" and add in the RSS feeds for Joystiq and Kotaku, or "Sports" and add ESPN RSS and whatever else.
- Text: "Check areas you are interested in"
- Item list:
- [x] Movies >
- [x] Travel >
- [x] Fashion >
- [x] Finance >
- [ ] Technology >
- [ ] Decoration >
- [ ] Design >
- [ ] Politics >
- [ ] etc >
Note: [X] and > reffere to a checkable and clickable list
07 - Menu->Custom Feed Page
- Text: "Select categories you would like to receive News from"
(List with buttons that can be both checked or pressed for new page)
- [ ] Internal Pub >
- [ ] External Pub >
- [X] Social Feeds >
- [X] General News >
08 - From 06->Social Feeds
- Text: "Receive news from the following networks:"
- Category list:
- [x] Facebook
- [x] Twitter
- [ ] Youtube
- [ ] LinkedIN
- On check, user must be prompted to enter login information (either popup or same page)
Branding guidelines
See attached file - Round_01_files.zip - Folder "StyleGuide"
Judging Criteria
- Cleanliness of your graphics and design.
- User Experience for Mobile application.
Target Audience
- Mnemosyne employees.
Supported Platforms
- iOS, Android
Submission & Source Files
Preview Image
Please create your preview image as one (1) 1024x1024px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Submit JPG/PNG for your submission files.
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 (sizes or colors) or modify overall colors. We may ask you to update your design or graphics based on other checkpoint feedback.
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.