Challenge Summary
Welcome to ACME Products - Customer Portal Design Concepts Challenge.
The purpose of this challenge is to purpose mockup/visuals of what the customer experience would like when interacting with the portal.
ACME Products offers a platform for businesses to sell their products and it’s committed to increasing their engagement with their customers by implementing a portal that seamlessly implements an integrated several processes called “customer journeys” that align to specific goals set forth by the strategy team at ACME.
ACME is just a codename for the project.
Round 1
Initial Designs for all the required screens..
- Customer Journey Homepage
- Customer Portal Homepage
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.
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.
End User of this Customer Portal is a seller of products involving multiple categories..In this challenge, ACME Products are looking to introduce new opportunities for their customers by implementing a portal that makes it easy for their customers to handle new marketing opportunities. We have provided a Scenario which helps you to understand the entire concept/application which the client is looking to build.��� Please review the HighLevel Process flow in the attachments area.
IMPORTANT!! Design Considerations:
- Colors and Fonts are open to the designer.
- We are looking for you to come up with clean and simple layout.
- Please use the size of the page as: 1024px (width) and height as required.
Roles in Scenario:
These are few roles which we have used in the below scenarios and pages..
Client Company (ACME Product):
- Assume this is client who is implementing this portal
- Jeanie - Works in marketing with this company and oversees the Company A
- Mike - works with Jeanie and supports all of her Accounts
Company A:
- Assume this as the Global supplier of all products and a customer of ACME Products.
- Roger is the shipping manager, has a desire to expand his shipping capability, so he can sell more products across the globe but has no idea where to start!
- Amy is Roger’s Boss.
- Janet is a new employee here and also reports to Amy.
Company B:
- New Product Maker who is a prospect for ACME Products
- Jared is a shipping manager.
Scenario / Required Pages:
Below are the pages required for this challenge. We have explained the required pages in the scenarios below..
Few steps before reaching the Customer Portal page are as follows:
- Assume the Marketing team at ACME Company has just published new "Opportunity Journey" (a packages of content and steps a person should go through in order to increase the performance of their business)
- This opportunity journey is a checklist of things Roger should know and questions Roger needs to answer to get started with shipping his products globally.
- Jeanie (ACME Employee) quickly associates this Opportunity Journey with Roger & Amy in their back office system which sends a branded email (see details on email template below) letting them know that Jeanie has made this content they are interested in available via the customer portal.
1. Email Template:
This is email template which roger receives in the above scenario for accessing "Customer Journey".
- We would like you to come up with an email template.
- This Email Template will have a header with a logo (you can use the attached sample logo)
- Also please come up with a footer at the bottom.
- Main content of the email template will be a few lines of text with a link to "Customer Portal"
- A user clicking the link in this Email Template will automatically be logged in to the Customer Journey Homepage.
2. Login:
If the user is not logged in, then a user sees the login page before viewing the Customer Journey
- A user will be able to enter username, password and have a Login button.
- We also need a Forgot Password link.
- In addition to the above, we also need a "My ACME" button to allow the user to directly login into the Customer Journey (Single Sign on)
3. Customer Journey Homepage:
After, Roger/Amy clicks the link in the email - then we show this page. (A logged in user will also see this page by browsing the opportunities)
- Roger will be able to see the below information and also will see a progress bar with steps to complete...
- My Account Team: Roger can see his assigned Account Team “My ACME Team” at ACME with their associated Profile photos for facial recognition. Not more than 4 people can be assigned to (1) Account
- My Co-Workers: Roger can also see his co-workers “My Co-workers” that are also apart of the “Opportunity Journey” and their associated pictures.
- Roger sees Amy listed but wants to add Janet, so he clicks on the empty photo with a “?” on it that has a caption of “My someone else...” to add Janet,
- To get Janet added he just types Janet’s email into a popup box and she’s instantly sent the same email Roger & Amy got originally but in the case the email is from Roger.
- News Feed: Roger can also see a News Feed type where other people from other companies like (Company B) are talking about the same topic “Shipping Products Globally”. Roger see a posts from “Jared” and also has the ability to Post, Share a Link or Photo into the group as well. How can this be shown in your designs?
- Live Chat with Account Team Members: Roger also sees that there is a green dot next to Jeanie’s photo indicating she’s online and available to chat. When clicked Roger is able to communicate directly with Jeanie in the a separate area of the browser while he’s checking out his “Opportunity Journey”
- Progress bar (% to Complete the Journey): Roger see a list of items (Journey Steps) he has to complete on this “Opportunity Journey” which a visual indicator of progress of 0% to motivate him to quickly get to 100%..please come up with ideas on how we can show this.
All of the features above should be available to you while you're on the Homepage for the "Customer Journey" the items below will change depending on which STEP of the Journey the user on.... so think of the items below which has features on a single while you're on a single step, show us your designs for both the below..
- Display Static Content: Roger see that he’s on Step #1, which show him a block of Texts with links about getting started. For Example: Journey Step #1 : Display Static Content with associated assets (files for viewing), recommended items (links) & button for advancement to next "Journey Step" ("Next" button)
(OR)
- Data Collection via Form: When Roger gets to the next step instead of seeing a block of Text, he’s prompted with a Form to fill in (use some sample text fields and labels), different assets and recommended items appear that can help him populate this form before he moves on to the next step. For Example: Journey Step #2 : Form for Data Collection with associated assets (files for viewing), recommended items (links) & button "Finish" to complete the journey and be redirected "Customer Portal Homepage"
Within each Journey Step the below features will be available.
- List Assets: Roger sees there are “Assets” attached to this step, which seems to be powerpoint and PDF files with a few lines of description for each of the file.
- List Recommended Items: Roger also see a section called “Recommended Items” which has a list of URLs for assets that exist outside on the customer portal that he can also navigate to.
- Advancement to Next Step: When Roger is finish with this journey step he click the “Next” button which guides him to the next step.
- When Roger moves from step to step he sees the percentage in the progress indicator increase.
4. Customer Portal Homepage:
- This page has all the features as mentioned in Customer Journey Homepage, expect that, instead of journey steps (progress bar etc..) - we will just show some visual advertisements in its place..you can use a placeholder for these
- and also News Feeds will just have Roger’s co-worker and his Account Team at Company A, not with Company B.
5. Browse Customer Journeys:
Roger will be able to view all the "Customer Journeys" (opportunities)
- This page will show listings of Customer Journeys (opportunities).
- Roger can start on his own without having to wait for Jeanie to opt him into the content.
Target Audience:
- Existing Customers
- New Customers
Judging Criteria:
- How well you capture all the above requirements
- Overall User Experience of the Application
- How well you have designed the Elements
- Cleanliness of your graphics and design.
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 and saved as layered PSD 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.