UI and Digital Media Content

This task is primarily for the Presentation Layer team member.

The User Interface is the "look and feel" of the software. The main purpose of the UI is to make using the software easy and intuitive, but also enjoyable. The color scheme, typography, and graphics employed should reflect a knowledge of the end-user's preferences and abilities, and also the constraints of the delivery platform.

Here's a dozen items to consider in the design of a UI:

1. Focus on the goals of the site
2. Know your audiences and their needs
3. Consider the competitive environment
4. Stick with brand guidelines
5. Form should follow function
6. Always consider device - horizontal vs. vertical screens
7. Color, contrast and flow
8. Keep It Short & Simple (KISS)
9. Consistency - dashboard
10. No gratuitous graphics
11. Measure twice, cut once - create a spec, doc, wireframe and static storyboards before any programming
12. Test with real users (small group of users) and revise as needed

Here's a ten-item "cheat sheet" of UI Design Principles:
https://xsrv.mm.cs.stonybrook.edu/c4g/assignments/UI_design.html

Here's my guest lecture for 308 on UI Design Fundamentals:
https://xsrv.mm.cs.stonybrook.edu/c4g/UI_fundamentals.pdf

Digital Media content, such as a logo, video, or photos may be provided by the client. You can also develop your own graphics with free, cross-platform tools like GIMP and Inkscape. You can create digital audio files with Audacity, and edit video with Blender. Copyright-free content can be downloaded from sites like Creative Commons. (See the Resources page for download links).

FYI, common file types that work with HTML5 include:

Graphics:
JPEG
PNG
GIF
SVG

Audio:
MP3

Video:
MP4