Challenge Summary
Welcome to the IBM - AcroFinder Mobile Screen Design Challenge!
Our client needs your help to revamp AcroFinder Mobile App, an iPhone app providing easy access for users to acronyms. We'd like to have some visual styling applied to the UI. In the end of this Challenge, we're looking for a SIMPLE and IBM-styled iPhone app.
In this challenge you are provided with the exisitng screenshots and guidelines to get insights into this mobile app and start working from.
Round 1
Submit your design for a checkpoint review
1. Home
2. Search Results
3. Acronym Wiki
4. Settings
9. App Icon
Notes : Any comments about your solutions, make sure you capture correct flow for every page!
Round 2
Submit your final design plus any client checkpoint updates
1. Home (Please include an AcroFinder logo on the home page in your final submission)
2. Search Results
3. Acronym Wiki
4. Settings
5. Feedback
6. Most Viewed
7. Favorites
8. History
9. App Icon
Notes : Any comments about your solutions, make sure you capture correct flow for every page!
Challenge Details:
The AcroFinder application aims to provide easy access for users to acronyms both internal and external to IBM. The target users for this app is any IBMer since there is such a variety of acronyms that are not specific to any department. However, there are a significant amount of acronyms that are not specific to IBM either which makes it usable to the general public as well.
Supporting Documents:
- Screenshots of the existing app (screenshots.zip)
- IBM Logo (IBM_logo.ai): please include IBM Logo in your design
Screen Size:
- Show your solution in Portrait View with the resolution 1334x750. Given that this is a iPhone Native App, it is supposed to fit into iPhone 5 & iPhone 6.
Design Guidelines:
- IBM Design Language could be a reference, but not a strict requirement.
- Make sure create all your graphic in 'vector' format (buttons, icons, etc), so when resize for bigger versions, graphic still look sharp!
Use Case Scenario:
- John is an IBMer.
- John wants to lookup an acronym
- John looks up acronym in app
- John is redirected to a list of relevant matches
- John identifies from the list the appropriate acronym definition
- John is made known of the meaning of the acronym he/she wished to lookup along with a link to its Wikipedia page
- Please refer to Support Document "screenshots.zip" for details
Design Requirements:
Please refer to pages in screenshots.zip for information flow. We want the UI redesigned to look more professional, please DON'T simply mimic/color the existing UI.
0. Navigation
- How does the user navigate this application?
- Include navigation that you think fits with this application
- Focus on the priority items and how things should be sized
1. Home
Refer to Page 1
- User can search any acronym he or she is interested in.
- User can assess to Settings
- It would be nice to keep the simple UI style in the exisitng screenshot
- Please include an AcroFinder logo on the home page
2. Search Results
Refer to Page 2
- User can get a list of search results
3. Acronym Wiki
Refer to Page 3
- User can learn more about the acronym he or she has searched by being directed to its Wikipedia page.
4. Settings
Refer to Page 4
- User can refer to About info and Help info
- User can personalize the app by changing its text size and background color
- User can clear Favorites and History
- Add a new independent item "Contact Us" at the bottom of the list, don't group it with "Clear Favorites" and "Clear History". User clicks "Contact Us" to get the Feedback page (refer to Page 5) directly.
5. Feedback
Refer to Page 5
- User can provide feedback to the team
6. Most Viewed
Refer to Page 6
- User can get the most-viewed items in All Time, This Month or This Week
7. Favorites
Refer to Page 7
- User can favorite an acronym and maintain a list of them in Favorites screen.
8. History
Refer to Page 8
- User can quickly go back to a list of the most recently searched acronyms.
9. App Icon
- We need an App Icon for this app.
- Size: 120 x 120
- Please follow the official iOS design guidelines on icon
Notes:
- Target Platform: iPhone 5 & iPhone 6
- Resolution: 1334x750
- Feel free to suggest any tools/function that can bring good User Experience for this Mobile Application.
Important:
- Keep things consistent; all graphic styles should work together.
- Think simple but effective solutions! Take in mind that we prefer the simple UI style as the existing app does.
- Please include IBM Logo in your design.
- The winner of the challenge will have to pre-slice (the source PSD or AI) with icons, backgrounds, headers, UI elements, avatars, images, buttons, etc. to make it easy to split up for use by IBM developers.
- We're looking for a SIMPLE and IBM-styled iPhone app.
Target User:
- The target audience for this application will be IBMers, open
Judging Criteria:
- Cleanliness of your graphics and design.
- User Experience of AcroFinder Mobile Application.
- Creativity and ease-of-use is key to the success as it must be engaging to the employee.
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.