Store Devices Health Monitoring Website Responsive Design Concepts Challenge

Welcome to Store Devices Health Monitoring Website Responsive Design Concepts Challenge.

In this challenge we are looking for your help to come up with new designs for store device health monitoring  website that will allow users and admin to monitor the health of the POS (point of sales) devices and network devices in the stores , across globe.

Really excited to see your designs for this challenge, good luck!

Round 1

Submit your initial design for a Checkpoint Feedback
01 Stores Device Health Dashboard (Desktop, Mobile)
02 Device Management (Desktop)
03 User Management (Desktop)
04 Store Device Summary Dashboard (Desktop, Tablet)

As part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Please include the MarvelApp URL in the comments while uploading your submission
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)

Round 2

Submit your Final Design plus Checkpoint Updates
00 Login Page
01 Stores Device Health Dashboard (Desktop, Tablet and Mobile)
02 Device Management (Desktop)
03 User Management (Desktop)
04 Store Device Summary Dashboard (Desktop, Tablet and Mobile)

As part of your final submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Please include the MarvelApp URL in the comments while uploading your submission
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)

This dashboard provides a singular view of the health of all stores across North America. This will enable store manager to keep an eye on their store performance on a daily basis, regional managers to check on how stores are performing (including sales). The dashboard will also allow the technical staff to identify and debug network/device related issues with minimal effort, eventually being able to provide predictive capabilities.

User Persona:
User could be one of the following: In-store sales associate, store manager,  regional sales manager, IT support, admin/super users. Each user will have varying levels of access within the application as determined by their respective user profiles.

Above users will be categorized and will have access / permissions as described below:
1. Normal User: Normal users can view the Stores Device Health dashboard & Store Device summary dashboard only.
2. Admin: Admin can access all the pages including device & user management also, as mentioned below.

Design Considerations:
- We have provided wireframes for you to get started, please DO NOT COPY.
- Branding: Client likes the following color combinations “Blue, black, red, white, etc”, please don’t use Green, Pink, PURPLE, etc however green can be used in metrics/stats/text as required
- You are encouraged to use Image/icons as required for apparel store, store registers, network devices, store devices - You can use images from outdoor activities like skating, surfing, hiking, trending lines, etc.
- Please make sure your designs are responsive (Laptops, iPads, Phone, etc.).
- If you are designing icons / graphics etc, please make sure to have them as scalable vectors...so we can resize it as required.
- We need to use “Wipro” logo (you can grab the logo from here: https://www.wipro.com/brand/) and there should be a placeholder for customer logo.
- Have your designs of size:
- - - 1366 x 768px (desktop)
- - - 1536 x 2048 px (tablet)
- - - 375 x 667px (mobile)

Required Screens:
We need below screens to be designed..

00 Login Page (Desktop, Tablet and Mobile):
- Come up with a simple login page
- Make sure to include all the required elements that you think is necessary in a login page (username, password, remember me, forgot password, etc)
- Have a space to include client logo

01 Stores Device Health Dashboard (Desktop, Tablet and Mobile):
- This shows the real-time view of the Stores and its devices health status.
- We would like you to include a map that shows the location of store.
- Would be good to show the overall summary that indicates the number of stores that are currently active (green) and that have issues (red)
- Provide a way for the user to search stores or a region
- Provided example shows just a few stores / think on how the map can accommodate many stores?
- NOTE: clicking on a store will show the store summary (please see below use case for more details on that).
- Think on how the navigation need to be put up!

02 Device Management (Desktop):
- This page allows the user to manage the list of POS devices
- Provide a way for the user to search, filter the devices..looking for your thoughts
- User will have the way to deactivate the device (no delete option will be available)
- We need a way for the user to add the device / please show how a user this screen works (add a device screen will include: device name, store name, store ID, OS and description

03 User Management (Desktop):
- This page allows the user to manage the list of users
- Provide a way for the user to search, filter the users
- User will have the way to deactivate the user (no delete option will be available)
- They will also have option to reset the password.
- We need a way for the user to add the user / please show how a user this screen works (add a user screen will include: Name, Email ID, User ID, Role and phone no.)

04 Store Device Summary Dashboard (Desktop, Tablet and Mobile):
- This shows the store summary, user will be able to view the below information:
- Name of the store
- POS AISLES: This shows the overall summary of the POS devices in the store and also list the individual device name along with its status. We do not need to list all the devices here as there could be lot of them (please see “More info” tab in provided pdf), so think of a way to show many of number of devices - we are open to your suggestions. Aisles here stand for lanes. Each checkout lane at the store is also called a checkout aisle.
- Store Summary: This shows the summary of sales within this store / note in the reference you can see that data is being pulled in here every half an hour, so need a way to list last 3 instances of when the data was updated...if the data is pulled, then it is green and if it is not pulled in the ½ hr duration then we need to indicate it in some way....looking forward to your thoughts.
- Network Performance: This shows overall summary and also shows the list of devices that are connected to the network and what devices are not connected.

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
- Focus on User Experience / how user interacts within the dashboard and other pages

MarvelApp Prototype
- We need you to upload your screens to Marvel App.
- Please send your Marvel app request to csystic@gmail.com
- You MUST include your Marvel app URL in notes /comments while uploading (in your marvel app prototype, click on share and then copy the link & share it within your notes while you upload).

Target Audience:
- In-store sales associate, store manager,  regional sales manager, IT support, admin/super users

Judging Criteria:
- How well you plan the user experience and capture your ideas visually.
- Cleanliness of your graphics and design.
- Overall design, UI and user experience.
- Consistency across the UX/UI
- How well you interpret the example screens (business relevance) and show us new ideas and concepts.

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
- Submit Marvelapp as part of your submission.

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 or Sketch!

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.