Challenge Summary
Welcome to the Styx Certificate Manager GUI Wireframe Challenge.
The objective of this challenge is to create the GUI wireframes for Styx Certificate Manager application based on provided guidelines stated in the challenge details.
In this wireframe challenge, we need you create required windows forms that are explained in the detail specifications.
Have some questions related challenge requirements? Let's discuss on challenge forum!
Round 1
Submit your wireframe for a Checkpoint feedback:- Submit an initial version of your solution.
Notes.jpg: Any comments about your design for the Client.
Round 2
Final wireframe plus Checkpoint feedback:- Submit final version of your solution.
Notes.jpg: Any comments about your design for the Client.
Certificate Manager Application Description
Styx deploys web-servers and message-brokers onto customer systems and networks. Our products require secure service-to-service and service-to-client communication via TLS secured HTTPS and AMQP traffic. Both protocols leverage certificates to authenticate and secure their traffic. Styx customers are poorly prepared to configure their networks with certificates. The Styx Certificate Manager is a Windows application that will make this process easy for the user.
We are looking for wireframe (Axure) solutions based on requirements below. We’re also looking to the community to come up with interesting ideas for the workflow - we’re absolutely open to creative solutions!
At the end of this wireframe challenge, we are looking to have a complete solution for the user experience and flow.
Downloadable Files
StyxCertificateManager_UseCaseDiagram.gif (attached to contest) - A use case diagram showing the functions of the Certificate Manager
Styx UX Guidelines.zip (download link) - User Interface and User Experience you need apply to your wireframe submission
StyxCertificateManager_RequirementsSpecification.docx (attached to contest) - The requirements of the Certificate Manager application
Wireframe Expectations:
- Produce HTML click-through wireframes that can be used to demonstrate all mentioned functionalities as required in each round.
- Follow the attached UX design guidelines (Styx UX Guidelines.zip) for your wireframe submission where appropriate. Note these guidelines mostly discuss web applications but many parts will still apply to the design of this Windows application.
- Let us know if need clarification about the UI/UX Implementation in your submission
- Implement User Experience as a standard Windows application and not as a Web Application
- For this challenge, please submit on 1024px width and height up to your submission
- You MUST cover all items mentioned in required sections below, if any requirement is missing in final submission the client will not look at it, so make a checklist for the required screens to make sure you create all of them.
- You MUST use wireframes note pane in every single view you design to explain what items are addressed in that view, use it to make your idea clearer and help the client to give you constructive feedback.
Submission Requirements
1. Main Window
This is the main window for the Certificate Manager application. It displays the name of the server, all known certificates and their details. From this window you are able to perform any of the actions for the application. You must include:
- Server Name
- Installed Certificates (Certificate Name, Server Name, Certificate Signing Athourity (CSA), Expiration Date, Certificate Store)
- Available Certificates (Certificate Name, Server Name, Certificate Signing Athourity (CSA), Expiration Date, Location)
For Installed Certificates you must also indicate if they are properly installed for Qpidd, nginx, or neither.
2. Edit Server Name
The user must be able to change the name of the server. This should not just be a simple editable text field but should require the user to initiate the action via a button or menu.
3. Update Certificate
The user must be able to update any certificate in the list of certificates. The user select a new certificate file from their computer which will replace the existing one.
4. Import Certificate
The user must be able to choose a new certificate file from their computer and have it appear in the list of Available Certificates. The newly imported certificate will appear in the list of Available Certificates.
5. Export Certificate
The user must be able to export any certificate from the list of certificates, choosing a location on their computer to save it to.
6. Install Certificate
The user must be able to install a certificate from the list of Available Certificates. During this action they can optionally choose to install it for Qpidd or nginx. The newly installed certificate will appear in the list of Installed Certificates.
7. Create Self-signed Certificate
The user will be asked to provide a friendly name for the certificate, this will default to the server name already displayed in the main window. A newly created certificate will appear in the list of Available Certificates.
8. Validate Certificate
The user will be able to validate any certificate in the list of Installed Certificates. Doing this will launch a new window showing a test webpage displaying "Test Successful!". When the user closes the window, they will be asked "Were you able to view the test page successfully? Yes / No"
Learn Axure:
New to Axure? Here are some quick tutorials to help you get started.
http://www.axure.com/learn
Target Audience
- Styx Customer
Judging Criteria
- Completeness and accuracy of the wireframe as defined in the spec requirements
- User Interface and User Experience for Styx
- How well your wireframes provide a consistent user flow.
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
Generated HTML files with all the requested contest requirements stated above.
Source Files
Wireframes should be built in Axure. The resulting files should have generated HTML files. Also, all the content must be listed and the pages are linked together to show page flow.
Final Fixes
As part of the Final Fix phase, you may be asked to remove, update, or change some features of the wireframe.
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.