Challenge Summary
Welcome to the Asset Tracker Responsive Web Design Challenge!
For this challenge we will be taking the existing look-and-feel from a mobile application design and applying it to the web version of the APP. There is some additional administrative functionality that we will explore with the web version of this APP, but you will be working from the established mobile design to convert to a responsive web version.
For this challenge, we need you to design the initial screens for the new Asset Tracker web application. This web application will be used along side the Asset Tracker mobile app (existing mobile screen designs provided for reference).
We look forward to seeing your creative designs!
Round 1
Round 1 will focus on the following screens for the new Asset Tracker responsive web application:
1) Dashboard
2) Search (Interactive Map Search)
3) Tracking Detail
4) User Permissions
5) Create a list / upload data
NOTE: See the design direction document to understand the screens / functionality needed for the new Asset Tracker application. If anything is unclear, please ask for clarification on the forum and we will be happy to help!
Round 2
In Round 2, you will need to include all Round 1 screens (updated based on checkpoint feedback). For Round 2, you must also include all the remaining functionality descibed in the project documentation, including the following screens:
1) Dashboard
2) Search (Interactive Map Search)
3) Tracking Detail
4) User Permissions
5) Create a list / upload data
6) Tool Detail Screen & Status
7) Tool Discussion - Messaging between OEM's and suppliers
NOTE: See the design direction document to understand the screens / functionality needed for the new Asset Tracker desktop application. If anything is unclear, please ask for clarification on the forum and we will be happy to help!
Primary Goals
The goal for this challenge is to build a responsive web application to send, receive, and access critical tooling information shared through a cloud-based system. A complimentary mobile application will also be built as part of the overall Asset Tracking project. You will be using the initial designs from our mobile application design challenge as the starting point for this challenge. For this challenge, we need you to create the initial screens / design concept for the new Asset Tracker web application. The web screen designs should follow a similar look-and-feel to the Asset Tracking mobile app (existing mobile screen designs provided as a reference). We are not requiring specific breakpoint dimensions as this is responsive design, but do ask for general justifications for mobile, tablet and desktop viewports.
Project Background:
Manufacturers / Original Equipment Manufacturers (OEMs) have historically not done a good job of managing, tracking and monitoring their multi-billion dollar annual investments in tooling throughout its 10-20+ year lifecycle. OEMs have a complex multi-tier supply chains where tool information is spread across many stakeholders, making it difficult to find and maintain over time. The sources of tooling information and the actual location of the tools is highly decentralized and degrades throughout the life of the asset. Ultimately, critical tooling information becomes disconnected from the tool and the probability of poor financial and operational outcomes increases over time.
A smartphone-based app will enable rapid deployment to a vast number of users across the global supply base of each Automotive OEM. A mobile-device based app will also avoid the cost and challenges associated with infrastructure and hardware requirements associated with other types of asset tracking systems. The OEM and suppliers would be able to send, receive, and access critical tooling information shared through a cloud-based system. OEMs would also have access to a responsive web app (administrative and management type view) and will be able to run analytics based on accurate tooling information leading to better decision-making and more effective tooling management processes.
Challenge Goals:
This challenge will focus on the following goals for the new Asset Tracker web application:
1) Refine the overall designs and UX
2) Focus on the user situations below in mobile, tablet and desktop viewports.
Web App Screens:
The web app will be utilized primarily by the Manufacturers (OEMs). It will be used to preform tasks on the following screens:
1. Dashboard
- Includes a number of widgets:
a. Tool tracking
b. Data analytics – assuming that the tool tracking includes viewing tools by location, this should focus on gaps in the data, including:
- Ability to view dashboard by multiple supplier codes or program and model year and view on search screen to see more details.
- View counts of tools by:
- Status
- Location
- Tools not in the same location as the supplier they belong to.
- View counts of parts by:
- Status
- Program
- Model year
c. Updates / Alerts
d. Users / Permissions
2. Search (Interactive Map Search)
- Different types of searches and search results
a. Search for tool by supplier, location and part number (part number or model year and/or program)
b. Search for part numbers by supplier, location and tools (all tools used to make a part across the supply chain)
- Export search results to excel
- Filter search results
3. Tracking Detail
- Maintenance, shipping, updates
- Reporting capabilities
- The app needs to inform suppliers about tool transfers or reconcile tools that were supposed to have transferred but never shipped or received (we're not sure exactly how this will work - we're open to your creative ideas and suggestions. Maybe suppliers should be scanning a tool when its shipped and the other supplier scan it when it’s received?)
- Historical tool transfer records
- Ability to export data to MS-Excel
4. User Permissions
- Add a user
- Manage existing users (ability to set levels of access based on user's role and responsibilities)
5. Create a list / upload data
- Create a list for an OEM or Supplier to complete
- Upload data sets from Excel Docs
- Assign list to a user to complete
- List status
6. Tool Detail screen & status
- View tool details, part number with detail view (latest part number and part count with drop down if more than one part), suppliers
- View part details, program, model year, status (Active, Obsolete, TBD, Invalid), supplier code
- Tool Status - part numbers added, status (calculated from part numbers: Active, Obsolete, TBD), date of last update, current location
- Prioritize / filter missing data
- Notes & Messaging
- Assign to an OEM or Supplier to complete data set
- Tool Status (i.e. current location, location history, new parts, percentage complete)
7. Tool Discussion - Messaging between OEM's and suppliers
- Push / email notification capability to interact between users of the Application
NOTE: See the attached Design Direction doc for additional details about each screen listed above. If anything is unclear, please ask for clarification on the forum and we will be happy to help!
General Requirements:
- Produce a front-end design concept (Storyboard) that can be used to demonstrate all screens / mentioned functionality as required in the challenge spec.
- Required designs are for a new, responsive application (the Asset Tracker web application).
- The design should have a clean, modern, look-and-feel that matches the design concept screens.
- The design must be very easy to use and intuitive. Keep that in mind when designing your solution.
- You MUST cover all screens mentioned in contest round details (and described in the challenge spec).
- Your design must represents all pages and flows from the challenge spec. You should use these descriptions as a guide, but if there is better way to display any information, feel free to reflect that on your design.
Branding and Guidelines:
- Your design should be responsive (i.e. scalable) for different form factors and resolutions. You have flexibility in which screen reslution you design to, but you'll need to make sure that your design is scalable and can be viewed responsively.
- For this challenge you can design within a range of 1024 x 768 up to 1440 x 900.
- As for color requirements, please stick to similar colors to the mobile app design concept screens.
- Creativity is also welcome!
- Use web-safe fonts for the pages content. Please make sure to declaring your fonts according to the Studio font policies.
- Show all the hover states for all UI elements you create (buttons, hyperlinks, dropdowns, etc).
Storyboard Requirements:
Overall:
- You need to create storyboards to cover all the web app pages listed above.
- Make sure to provide screens for popups, collapase/expandable features, error forms, and so on.
- As a suggestion, look at all the buttons in the forms to understand the interaction features of the application.
Project Documentation:
1) Previous design concept for the Asset Tracker mobile app.
2) Current brand guidance: Please use these as a guideline, creativity is also welcome!
Target Audience
Manufacturers / Original Equipment Manufacturers (OEMs) and suppliers.
Judging Criteria
- Overall look and feel of the design
- Simplicity and consistency in the design
- Completeness and accuracy of how the design matches the screens / flow of the wireframe.
- How well you follow the client's branding / design guidelines.
- Any suggestions, interactions and user flows you recommend (provide any notes or comments for the client)
What to Submit
Preview JPG/PNG Image File
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 ZIP File
All requested contest requirements/screens as JPG or PNG files.
Source ZIP File
All fully editable original source files of the submitted design as required by the contest under "Source Files" in the side bar.
Final Fixes
As part of the final fixes phase you may be asked to complete one round of minor changes to ensure your submission meets the stated requirements of this contest. See more information about Final Fixes.
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.