Social Network iOS7 App Storyboards Design Contest - Part 1

We are happy to introduce this new project to the community to help us with the graphic design and user experience of a potential social application. Welcome!

There will be two contests to complete this iOS application. We need you to come up with the look and feel of the iPhone application which branding will be quite simple, the default look of the native iOS7 components. In other words, you don’t need to care about graphic design that much, it’s about the user experience!

Round 1

For your R1 deliverables please submit the following requirements under “Storyboards Requirements” section – PORTRAIT VIEW ONLY:
1. Splash Screen

2. Login
2.1. Registration

3. Social phonebook
3.1. Requests
3.2. Edit contacts
3.4. Contact Details
3.6. Social Profile

9. Search
9.1. Search Results

Feel free to add some notes (jpg or text file) to comment your design features for the client.
Number your screens as shown in the requirements list (01, 02, 03 etc.) – it’s easier to review.

Round 2

Final design will contain the mentioned requirements under “StoryboardsRequirements” section plus any updates from client feedback.
1. Splash Screen

2. Login
2.1. Registration
2.2. Forgot password

3. Social phonebook
3.1. Requests
3.2. Edit contacts
3.3. Tags
3.4. Contact Details
3.5. Social Search
3.6. Social Profile
3.7. Send contact request

8. Alerts
8.1. Add Alert
8.2. Edit Alert

9. Search
9.1. Search Results
9.2. Share Search

11. Preferences

12. Notifications

Feel free to add some notes (jpg or text file) to comment your design features for the client.
Number your screens as shown in the requirements list (01, 02, 03 etc.) – it’s easier to review.

The primary goal of this contest is to design screens that show the look and workflow of an iPhone application. This application offers social networking features such as chat, friend connections, profiles, messaging and more. It’s your task for make these features interesting (UX wise).

You must focus on the user experience; make it very simple and easy to use. The design must follow the branding guidelines from the default look of an iOS7 application. It means, we’re not looking for an original application design.

Branding and Guidelines
- Design screens for iPhone retina display at portrait view 640 x 960 px; RBG color mode at 326 pixels per inch. There is only one requirement where we need landscape view (960 x 640 px - see more info below).
- Source file must me Adobe Illustrator.
- Follow design standards from iOS7, using default UI components.
- DO NOT make original application designs. This is quite simple (graphically). You can re-think the layout and suggest improvements, however it must be strictly tied to the iOS best practices. Read Apple Design Resource Center for more information.
- The application logo/icon is attached, AppLogo.svg.
 - Declare your fonts according to the Studio font’s policies.

Storyboards Requirements
You are provided with rough mockups of the application – Wireframes.zip, the concept. As well as the AppFeatures.doc which contains specific descriptions of the application features; it’s not mandatory to read but it may help you to understand what some components do in the application.

Remember to focus on the user experience. You are encouraged to think the layout to make it a perfect suit for the iOS design standards; that’s an asset that may help you to win the contest.

1. Splash Screen (See 01_Presentation.png from wireframes)
- Use the logo on white background and represent the “intro” of the app.
- Client liked “Clash of Clans” game app as reference for intro. You could use it as reference but don’t copy anything.

2. Login (See 02_Login.png from wireframes)
- Make sure to provide guest, email/pass, social networks login scenarios.
- After login user lands on search view screen.

2.1. Registration
2.2. Forgot password

3. Social phonebook (See 03_Social phonebook.png from wireframes)
3.1. Requests (include edition)
3.2. Edit contacts
3.3. Tags
3.4. Contact Details (invite, delete)
3.5. Social Search (local, world)
3.6. Social Profile
3.7. Send contact request

* Show Landscape view for #3, #3.1, #3.5 and #3.6 only in the whole contest.
* Internet index of influence KLOUT is just a number. Decorate it at your consideration.
* Linked payment gateways. In the User Profile screen, in the section linked payment systems should be represented in graphical form only, ie the icon for each of the payment gateways it has configured the user. The image to be displayed must be the standard of each of the platforms.

8. Alerts (See 08_Alert.png from wireframes)
8.1. Add Alert
8.2. Edit Alert

9. Search (See 09_Search.png from wireframes)
9.1. Search Results
9.2. Share Search

11. Preferences (See 11_Preferences.png from wireframes)

12. Notifications (See 12_Notifications.png from wireframes)

* IMPORTANT NOTE: Don’t design each one of the screens shown in the workflow/wireframes. Just extract the unique screens according to the required features. As you can see, some screens repeat along the workflows, but they mean to show you how the application works and connects their components, just that.

Resources
- Download here the iOS7 UI Kit for Illustrator – iOS7_UIKit_Illustrator.zip
- There is a PSD version available in case you’re more comfortable with this software and you are willing to work with the transition from Photoshop to Illustrator - iOS7_UIKit_PSD.zip

Target Audience
Wide audience overall. Massive public and companies.

Judging Criteria
- How well you implement the design following the provided guidelines.
- Simplicity.
- How intuitive is your solution?
- User Experience.

Submission File
All requested contest requirements/screens as JPG or PNG files at 72dpi.

Source Files
All original source files of the submitted design. Files should be created in Adobe Illustrator and saved as layered Ai vector files.

Preview Image
Create a 1024x1024 JPG or PNG file in RGB color mode and place a screenshot from your submission within it.