Challenge Summary
Over the last few months the Studio Community has helped Cessna Rebrand their Mobile Applications. Now we would like to get continue the branding/GUI Kit by creating a "Style Guide" that will help designers and developers to better understand the Cessana User Interface.
At the end of this contest the Client is looking to have a two style guides (One for Cessna Marketing Apps and another for Cessna Calculator Applications) that are clean, intuitive, and easy-to-use.
Read the Contest Details and let us know if you have any questions.
Round 1
Items we would like to review at the Milestone
- Please submit your initial style guide for Cessna Calculator Applications
- Notes.jpg: Any comments about your design for the Client.
Round 2
Final Submission
1) Cessna Marketing Applications Style Guide
2) Cessna Calculator Applications Style Guide
- Make sure to apply the feedback's suggested by the Client.
- Notes.jpg: Any comments about your design for the Client
The primary goal of this contest is to create the Two Cessna "style guides"
1) Cessna Marketing Applications Style Guide
2) Cessna Calculator Applications Style Guide
The style guides will be used as a reference by designers and developers. Consistency is the key to successfully conveying the Cessna User Interface (UI) to their Users. You will need to review the provided files and document the User Interface for each of the applications.
This guide will help Cessna to avoid confusion by clearly defining the Cessna Interface and maintaining consistency in design, color and font usage.
Your Cessna Style Guide file must be in Microsoft Word because the client needs the ability to easily edit the document.
Contest Downloads:
Cessna GUI Kit:
Download Preview Images (PNG)
Download Source Files
Cessna Marketing Apps
Download Preview Images (PNG)
- (Cessna Info App), you can download the Source files here:
Download Cessna Marketing Source
Cessna Calculator Apps
Download Preview Images (PNG)
- (Cessnav Apps) source files below,
Cessna Loading Calulator: Landscape and Portrait
Cessna Performance Calculator: Landscape and Portrait
Required Sections in the Style Guide:
You are required to create two style guides – one for Cessna Marketing Apps and another one for Cessna Calculator Apps. Create your style guide document in Landscape orientation (horizontal) layout to make sure you have more space to insert the style tables and any images.
1) Cover Page:
- Design a simple cover page, we expect it to be visual appealing.
- The Cover Page should have the Cessna Logo and also should contain a title for the style guide
- You can grab the logo and any other design sources from the sources linked to this contest
2) Header & Footer:
- Design a simple page header
- We will require the Cessna logo and title in the header.
-We need a simple footer, we are looking for your ideas for footer - need not contain a logo as we already have them in the header.
3) Table of Contents:
- Any ideas here to make it easy to navigate and visually appealing are welcome.
- We need all the sections in GUI kit as “Table of Contents” in the style guide, follow the sections as shown in the GUI Kit for Marketing and Calculator Application.
-If you think, you need to add more sections to the style guide - you can show your ideas on that.
- Make sure to link the table of contents to their respective sections pages in word.
4) Capturing Styles:
You will need to do the following to determine the style for each of the elements shown in the GUI Kit,
- You will need to find the design attributes of the styles in the PSD source. See how Layer Styles has been shown in Style Guide. (Layer Style: You can find the layer style by double-clicking on the selected layer in PSD.)
- Add the identified Layer style, you can add the layer styles for individual item/sometimes it could also be listed for group of UI elements. If you have better suggestions to listing the styles – you are free to do that.
- Make sure to add the Layer styles to appropriate sections (buttons, forms etc.) within the style guide.
- Add images wherever necessary.
References
Below are some references of importance of creating a style, note that some of the referenced style guide are based on HTML or PDF - but for this contest we need the style guide to be in word (.doc) format.
http://tympanus.net/codrops/2012/09/06/do-i-really-need-a-style-guide/
http://www.netmagazine.com/features/create-website-style-guide
http://kmsm.ca/2010/15-corporate-style-guides-for-branding-inspiration/
Branding Guidelines
-You can use Cessna logo from the linked source files
Target Audience
- Designers and Vendors
- Developers
Judging Criteria
- How well you plan and develop your Style Guide Documents.
- How well it captures the Cessna Mobile branding from the GUI Kit and other sources files.
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
We need your style guide document (.doc)
Source Files
All original source files of the submitted documents.
Final Fixes
As part of the final fixes phase you may be asked to modify the organization of your styles or modify any details mentioned in the style guide document.
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.