Challenge Summary
Welcome to AppXpress iOS Design – Topcoder Mobile App Design Challenge - [Swiftoberfest]!
The goal of this challenge is to provide a mobile tool for community members to be more effective and more engaged in the Topcoder platform.
Upon installing this mobile app, the user should be presented with the list of open challenges. Login/sign-up is an option that should be out of the main flow, perhaps in a corner navigation element. Once a user attempts to register with a challenge, they will be forced into the sign-up/login flow. Optionally, the user can go to the navigation element and sign-up/login.
Round 1
Submit your design for a Checkpoint feedback:
0. Navigation.
1. Register Page.
2. Login Page.
3. Open Challenges Page.
6. Push Notifications.
- If you have time - please provide us with a click map for your design.
- Readme.jpg : Provide notes about your submission.
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03).
Round 2
Final Design plus any Checkpoint feedback:
0. Navigation.
1. Register Page.
2. Login Page.
3. Open Challenges Page.
4. Registered Challenges Page.
5. Register to a Challenge Page.
6. Push Notifications.
- If you have time - please provide us with a click map for your design.
- Readme.jpg : Provide notes about your submission.
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03).
Challenge Description:
The purpose of this Challenge is to redesign the entire Topcoder Mobile IOS Application, there is a current application from which we are providing screenshots, and in this challenge we want to focus on new topcoder branding and current IOS 9 design.
We are looking for the [topcoder] design Community to help us with planning our new "user experience" (UX).
Supporting Documents:
- Current App Screenshots (reference.zip), you can reference the screenshots for real content, please don’t use any lorum ipsum text, plus you can change the layout.
- Topcoder logo (topcoder-new-artfile-outline-CS6.eps)
- Topcoder Branding Guidelines (Google Drive)
Screen Sizes:
- Mobile Resolution: Design for iPhone 6 Retina Display 750px x 1334px.
Make sure you create graphic in 'shape' format, so when we resize graphics will still look sharp! It will be great if you can provide the landscape version.
Main Features:
1. Users can sign-up with Topcoder and become a member.
2. Members can login.
3. Members can view list of challenges for which they have registered.
4. Members and non-members can view list of open challenges.
5. Members can register for a challenge.
6. Members can receive push notifications about registered challenges.
User Flow:
- Christina heard about topcoder, she downloaded the application.
- Christina signs-up.
- Christina logins to TopCoder application.
- Christina views open challenges.
- Christina registers for a challenge.
- Christina starts to receive push notifications.
Required Screens:
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) Register Page:
- We need topcoder logo to be present on this screen.
The user should be able to fill his:
- First Name.
- Last Name.
- Username.
- Age.
- Select a Country.
- Email.
- Password.
- Password confirmation.
- I agree to the Terms of Service and Privacy Policy.
2) Login Page:
- Please reference 01_Login_Screen.jpg
- We need topcoder logo to be present on this screen.
User needs to fill:
- Username and password fields.
- Remember Me Checkbox.
- Forgot Password link
- We want Login button.
3) Open Challenges Page:
- Please reference 02_Active_Challenges_Page.png
- Members and non-members can view list of all open challenges.
- Here we need you to list open challenges information:
-- Challenge name.
-- Prize.
-- End Date.
-- Next Deadline.
4) Registered Challenges Page:
- Same as above but members can view list of challenges for which they have registered.
5) Register to a Challenge Page:
- Members can register for a challenge.
- The user only needs to click a register button and he will be registered to the selected challenge.
6) Push Notifications:
- Members can receive push notifications about registered challenges.
- Show us Push notifications for:
-- Timeline ending (example: checkpoint phase ended).
-- Forum post.
-- Winner announcement.
Important:
- Keep things consistent. This means all graphic styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance
Target Audience:
- Topcoder community members, and prospective Topcoder community members.
Judging Criteria:
- How well you plan the user experience and capture your ideas visually.
- Cleanliness of your graphics and design.
- Your design should possible to build and make sense as a mobile application.
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 and saved as layered PSD file, or Adobe Illustrator as a layered AI file.
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 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.