Challenge Summary
Welcome to Sky Zone - Jump Park Configuration and Catalog UI Design Concepts Challenge 2. For this challenge, we would like you to design a subsection of the “Skyzone Web Design”. You will design 2 of the tabs on the mockup screens (Note: only the inside sections are required to be designed - as the web framework is being handled in another design challenge, if you have time - please try to participate in that as well to double your chances of winning).
This web application will have multiple page sections and will be used on multiple screen sizes. Each section should be designed to run as independent applications.
DOUBLE your winning chance by participating in another Design Challenge for the same application:
We are also running another challenge that is focusing in on the entire application framework and few other portions (Time, Customer, Jumper, Waiver, Merchandise, Payment) so you have double the chances to win!
Sky Zone - Jump Park Web Application UI Design Concepts Challenge 1
Round 1
Submit your initial designs for Checkpoint Feedback
A) Park Configuration:
- 1) Home Page
- 2) General Park Information
- 3) Hours
- 4) Packages
- 5) Party Rooms & Courts
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Your Final designs for all the required designs with all Checkpoint Feedback implemented.
A) Park Configuration:
- 1) Home Page
- 2) General Park Information
- 3) Hours
- 4) Packages
- 5) Party Rooms & Courts
- 6) Waivers
- 7) Coupon
B) Catalog:
- 8) Product List
- 9) Add New Product
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
The park configuration tool will help park owners/managers set up their backend functionality of their parks. The park configuration takes a park owner through several screens and requires they fill out information needed at every park. Some of the sections will be simple and quick to finish and edit. Others sections like the packages and catalog will have drill down sections and the ability to create new from preset and open input options. A park owner will revisit this screen from time to time. The landing screen should be useful and allow the owner/manager to gather information at a glance and revisit sections to make park configuration edits.
Design Requirements:
- Minimal design look and feel
- Use light color tones. Less is more for this challenge. Clean and refreshing is preferred.
- Emphasis on usability. User need to be able to navigate this on touch enabled screens.. Keep this in mind when designing as we want users to not worry about accidental button clicks.
- Sections - The sections that relate to the navigation should run as independent applications. They may be used all together on a webpage, or independently on touch enabled devices.
Keep in mind functional use as a stand alone area.
Color Palette
- We had provided a branding guidelines, please follow them
- Note: If you decide to use the sz orange color, use it sparingly. We would prefer any color used to revolve around the blues, greys and whites. If you choose to use the orange anywhere in the design make sure it is not a primary focus and only helps define or accent the action or tool.
Screen size:
Screen sizes will vary, this design will need to account for a responsive multi-viewport experience. i.e. from small (7") to large screens (28").
- For this challenge, we would you to keep the resolution as 1920 x 1080px
Typography:
Sky Zone has a license to the use Proxima Nova font family for their native application.
- Proxima Nova Regular, Proxima Nova Light and Proxima Nova Semibold
(Fonts are not supplied as the license prohibits from sharing it, so if you have these fonts please use them or else use a comparable font and we will change them as a part of final fixes)
About the Client
- Reference skyzone.com for information about the company.
Documents Provided:
- Mockups: Screen mockups to help you get started with your designs
- Branding Color Guidelines
Required Screens:
We need below screens in this challege...
A. Park Configuration
The park configuration screen is a management tool for setting up a parks backend system. In this page, you need to design the following subsection
1) Home Page:
A screen to show all of the below sections.
- Quick navigation to sections
- % completed
- Help links and documentation
- Dashboard elements
2) General Park Information:
We need below inputs to be in this screen
- Park Name
- Park Number
- Park Address
- Park Phone
- Capacity
- Managers
- NS ID
- FP
- RBA
3) Hours:
- Park hours for 7 day a week schedule.
- Holiday and Closed days (This might be set individual days, A series of days)
4) Packages:
A package is a combination of park activities, use of rooms, jumper admissions, and food/drinks. Each park can offer different package however all parks will be able to choose from some pre-created packages.
Existing package:
- Display all the packages the park is currently using.
- Allowing the user to change the package for a park will really help, how can they go about changing this?
Add/Create package:
Choose from a pre-existing list of packages and apply them to the park or Create a unique package for the park
- Package Name
- Package Price
- Room
- Amount of Guests
- Amount of Jumpers
- Food (Sub category of food items: Pizza, Soda, Chips, Candy, etc)
5) Party Rooms & Courts:
- Party rooms are rooms usually dedicated for parties (like children's birthdays), in these rooms - people can have their pizza, cokes, cake, etc.
- Courts are the different, they are the trampoline jumping areas in the park. You can reserve a court for your group or party. The whole park is a trampoline park, with different areas that they call courts. So, you can play dodgeball, or open jump, jump into foam pits from a trampoline, etc.
- Manager will have the ability to view the list of existing rooms & courts in the park.
- They will need the ability to edit the details of courts / rooms.
- Should have the ability to create rooms or courts (minimum input that will be required are "Name, Type, Capacity").
6) Waiver:
Waivers are the terms and conditions of a park..
- Provide options to edit legal sections of a waiver form (there could be many sections within a waiver form)
- Each section will be added to a legal document or online form that customers will have to accept or decline.
- Create multiple text input areas that will be added to a waiver.
(Please see other design challenge to get an idea on which step a customer sees a waiver)
7) Coupons:
- This page allow the employees to customize coupons for customers.
- Show a list of existing coupons with filters/search options - open to your thoughts!
- You can choose to have an existing coupon to edit or create a new coupon.
Create New coupons
- Coupon Name
- Coupon Type: Total Price, Merchandise, Package, etc
- Coupon Amount: $ or % off
- Anything else you think we need here, please add them (Set Expiration Date?...etc..)
B) Catalog:
Each park can create a unique catalog (price book of products). The catalog is a section to display existing products and items and also to add new ones. These items are products that will be sold at a park.
For example, a user reaches the catalog section, and will have 2 options. The options should be to view a list of their current products and to add products.
These are the products that will be shown to the user as Merchandise (please see another design challenge that's running in parallel to understand merchandise).
8) Current list:
- They will have the option to view their current list of products and quickly make a decisions on them.
- Provide a simple search while displaying list of products (filters will be helpful?)
- From the list of products, provide options to edit - this might result in a quick modal window with edit options to add attributes to a product. For example, assume, we have "fountain drink" product and they are looking to add additional flavor attributes and change the pricing - so, they could click on the product and quickly add additional flavors and change the pricing for small, medium, large sizes.
- We are open to thoughts on how this screen need to work..looking forward to your ideas!
9) Add New Product:
- When adding a new product, it should be a simple and quick flow.
- The user searches for a product type (Drinks), then a sub type (fountain drinks), then the ability to add attributes, like sizes and price, and flavor offerings. A user should also be able to quickly search by name or quick filter.
Target Audience:
- Park Owners and Managers of Skyzone
Judging Criteria:
- How well you plan the user experience and capture your ideas visually.
- Your design should possible to build and make sense as an application
- Cleanliness of your graphics and design
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.