Challenge Summary
Welcome to Brivo - Responsive Website Additional Pages Design Challenge.
Recently we ran a few design challenges to design the pages for Brivo.com. In this challenge, we are looking for your help in designing couple of additional pages for desktop, mobile versions and also looking for you to design the mobile main navigation menu.
Round 1
Initial Designs for all the required screens.
- What does Brivo Do? Page (Desktop and Mobile)
- Brivo Dealer Landing Page (Desktop)
Feel free to add any other additional screens which are necessary to explain the flow of Application
Notes.jpg: Any comments about your design for the Client
NUMBER YOUR SCREENS (01, 02, 03 etc.) - it’s easier to review with the client.
Round 2
Your Final designs for all the required screens with all checkpoint feedback implemented.
- What does Brivo Do? Page (Desktop and Mobile)
- Brivo Dealer Landing Page (Desktop and Mobile)
- Mobile Menu Navigation
Feel free to add any other additional screens which are necessary to explain the flow of Application
Notes.jpg: Any comments about your design for the Client
NUMBER YOUR SCREENS (01, 02, 03 etc.) - it’s easier to review with the client.
The main goal of this challenge is come up with NEW Pages for the all NEW Brivo.com site.
Challenge Downloads:
- Source files from the previous challenge are available on Google Drive.
- Please ask permission to bwalles"at"appirio.com and csystic"at"gmail.com
IMPORTANT!! Design Considerations..
- The site will be responsive - design for Desktop and Mobile (iPhone) in this challenge
- Please go through the NEW page requirements and come up with better user experience.
- Give importance to the overall layout and think on how a user would interact with the content on the page.
- Please use the given source files as a base for this challenge.
- Please make sure the new pages which you are designing matches the look & feel of the existing designs.
- We have provided the design direction document '2.0Brivo-Design-Direction-Doc.pdf' to help you get started on the NEW pages.
Required Pages:
Below are the pages required for this challenge..
What does Brivo do? Page
This page is accessed when a user clicks on “What does Brivo do?” in the main navigation.
- This page is a high level summary of Brivo brand benefits.
- Each of the benefits listed will have a few lines of description and an image.
- Feel free to come up ideas on how to display these these points
- This landing page links to more detailed pages of each brand benefit.
- Page also has callouts to become a brivo dealer and to view brivo products & solutions.
** - Please provide a design for a benefit detail page (note...this page is not in the design diretion...but we're looking for a design concept. You can get content for this by going to http://www.brivo.com/benefits)
Revised layout of "Brivo Dealer Landing" page
For this page, please have the 08_Brivo_Dealer.psd (desktop) and 16_Brivo_dealer_phone.psd (mobile) as base.
- The Brivo Dealer Landing page should be similar in structure to the Brivo home page...it just needs to be more focused on what matters to a brivo dealer.
- At the top, we need a couple of call to action buttons (Become a Brivo Dealer and Watch Brivo Dealer Story) that allows users to explore more about the dealers.
- "Why Should you use Brivo?" section should emphasize the purpose of using Brivo with a button to "Brivo Brand Story"
- Please follow the Brivo Solutions that is given in the Products page (02_2_Products.png).
- Think to include space for new products, how to become a brivo dealer.
- How should the "Featured Products" section need to be shown?
- Reference existing Brivo dealer page (http://www.brivo.com/dealers/) for possible content options.
- We would like you to include a Request for a demo, Become a dealer button, and sign into your brivo account flow
Mobile Main Menu Navigation
Currently the main menu navigation doesn't exist for the mobile, so we would like you to come up with the mobile navigation design
- You can use any of the mobile screen (home screen etc) for showing this navigation
- We would like to have the navigation in the side
- Think on how a user calls this navigation and what could be animation?
- This navigation will have the links as shown in the desktop design header.
- Please go through the reference below, we had imagined something like this but please DO NOT COPY.
- Reference: http://dribbble.com/shots/765441-close-side-menu?list=show&tag=mobile_menu
Target Audience:
- New Users, Existing Customers and Dealers
Judging Criteria:
- How well you design the additional pages for NEW Brivo.com
- How well your design matches the existign pages look & feel
- Cleanliness of your graphics and design.
- Design looks and User Experience.
Submission & Source Files:
Preview Image
Create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Please upload PNG images in a zip file with all requested contest requirements stated above.
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, images (sizes or colors) or modify overall colors.
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.