Outcomes addressed in this activity:
Unit Outcomes:
Create a physical design for a user interface using standard design principles.
Employ appropriate professional design tools.
Course Outcome:
IT302-6: Design a user interface with appropriate professional tools.
Purpose
Now, you put everything together! You will use everything you have learned in previous lessons to create your Unit 10 Assignment.
Assignment Instructions
It is time to get creative and put your knowledge to use. This assignment will produce a professional storyboard and design specifications for an original interface design. Make sure you are careful with all instructions below.
Tool Options
You must use Visio or Figma® to create your wireframes. Review the Figma Instructions document for more information on that tool option. The tools in Word, PowerPoint, Excel®, Paint®, Dreamweaver, Photoshop®, and Flash® are not acceptable.
Topic Options
Using principles learned in this course, develop a storyboard for an original website, standalone kiosk, or smartphone application design to fulfill one of the following needs:
An interface where an air traveler can check in, receive their itinerary, check flight status, etc.
An interface for pet owners to check vet appointments and medications, keep track of weight, etc.
An interface for a consumer service that compares prices of kitchen appliances (both large and small).
Wireframe Requirements
Images must be line drawings, not full-color renditions.
Provide at least five different screens or images if you are designing a kiosk or phone application or at least four webpages if you are designing a website.
Ensure that all parts of your screens are labeled and that all text is readable in your assignment document without having to zoom past 100%.
For paragraph content, you may use lorem ipsum text as explained in the Unit 6 PowerStart.
Include a shape to indicate where a logo will be placed. Do not actually create a logo, but think of ideas to be able to describe it in words in the design specifications of this assignment.
Include text and/or arrows to show or describe actions (to get from one screen to another, etc.).
Include a login screen for username and password.
Make good use of your screen real estate, as explained in Unit 9.
Do not copy existing designs. This assignment must be of your own construction.
Note: Assignments based on existing designs will result in a grade of 0.
Template Instructions
You must use the Unit 10 template. Also, refer to the Unit 10 examples document for further guidance with this assignment.
Failure to use the template will result in a grade of 0.
You may change the font style in the template if you wish, but keep the basic document formatting.
Cover page: At the locations indicated in the template, give your design a name, briefly describe it (include the device, audience, and purpose), and insert your name and date.
Starting on page 2:Under the Storyboard subheading, indicate the tool used for creating your wireframes.
Then insert your wireframe images. Either take screenshots, save your wireframes in an image format such as jpg or png, or embed your work. It is important to present a clean document, so crop the images to show only your work, not the wireframe interface itself.
In this section, include any additional labeling or explanations so that your client understands the design and functionality.
Complete the design specifications table with appropriate content. Complete all parts of the table:Number of screens: Provide a numbered list with brief descriptions of each.
Fonts: Identify the family and the specific font, for example, sans serif (Arial). Explain any options to customize size and/or style.
Colors: Identify basic contrast, branding colors, and any options.
Windows: Identify whether the design is SDI or MDI, and explain why.
Icons and images: Specify the screen number and show screenshots of all icons. Include the purpose or text label and the full URL where the icon is found (research icon libraries, if necessary).
Briefly describe other images, including the logo. You must include some images in your design.
Menu/main navigation: Briefly describe the navigation for your design.
Auditory elements: Describe any auditory elements used, their purposes, and whether each is an earcon or auditory icon. If you do not intend to include auditory elements, you must explain why.
Haptic elements: Describe any haptic elements used and their purposes. If you do not intend to include haptic elements, you must explain why.
Security features: This part is already filled out for you, but if you have additional security measures, add a short description.
Once you are done with the content of your assignment, check the page numbers listed on the cover page’s table of contents and make adjustments if necessary.
Assignment Requirements
Note: This is not an APA-style paper, so there should not be any additional title pages or citations/references. Any source material necessary for icons should be presented simply as URLs (as explained above).
Place this order or similar order and get an amazing discount. USE Discount code “GET20” for 20% discount