Design Phase intro & User Interface Design (Ch 8) What is Design? DESIGN Analysis Determining Requirements (WHAT)
Design - Determining the Solution (HOW) ANALYSIS IMPLEMENTATION DESIGN "the Bridge" "Requirements gathering" "Construction" Involvement Less user involvement More technical specialists Modeling the solution The blueprint SDLC Phase: Design Core Process 4: Design system components
Environment (Ch 6) Application components (Ch 7 & 13) User interfaces (Ch 8) Database (Ch 9) Software classes (Ch 12, 13, 14) User Interface Design Chapter 8 Outline User Experience User Interface UI Design Reports Design
Principles of UI Design From Analysis to UI Design Reports Design User Experience (UX) User experience (UX)
All aspects of a persons interaction with a software application. Actions, Responses, Perceptions, & Feelings (before, during, & after) UX vs Usability (user-friendliness) Usability can the user accomplish their task UX was the experience enjoyable User Interface = SYSTEM
The inputs & outputs that directlyinvolve a human user/actor User-Centered Design Focus on the users Ensure Usability Use Iterative development It should encompass the principles of HCI Human-Computer Interaction (HCI) A field of study concerned with the efficiency and effectiveness of user interaction with computer systems, human-oriented input and output technology, and psychological aspects of user interfaces User Interface =SYSTEM to the user Principles of UI Design
Human Interface Objects (HIO) - a GUI control click, double click, hover, etc Principles Visibility Affordance Consistency Feedback Record has been saved Discoverability - click on an object to bring up hidden features Closure clear beginning, middle, end Reversal of Actions Readability Fonts: size& color Reduce Information Overload Navigation Usability Provide Shortcuts Error Handling dont allow the system to crash (nor allow dirty data) Simplicity Reduce Short-Term Memory Load Cust ID: From Analysis to UI Design
12:20 Fri 1st: Know the User! 2nd: Use your Use Cases & Use Case Descriptions! From Analysis to UI Design
Group use cases into a Menu Hierarchy From Analysis to UI Design
Determine your Navigation Use MENUs to organize use case functionality Design an overall menu hierarchy subsets for different users Different types of users might have different menus Storyboarding "Check out shopping cart" use case
Can also use Visio 2010 WireframeDiagram Report Design Report Types Report Features Detailed Summary Exception
Executive Report Features Control break Drill down Detailed Report Summary Report Aggregate Functions CrossTab Exception Report Control Break Drill Down Capability Reports Graph Turnaround Document More User Interface Design Tips
Chapter 8 UI Design Guidelines For each Form Layout Application name
Form title/purpose Layout Consistency Grouping UI & Paper Form match UI Design Guidelines Formatting Fonts and colors Tab order
Arrangement of controls Perfect alignment & spacing Layout Toolbar Alignment Spacing Order Tab Make Same Size Center in Form UI Design Guidelines Provide Navigation Help Facility
Form Navigation Record Navigation Help Facility Free of spelling & grammatical errors UI Design: Windows Forms
Interface Layout and Formatting Consistency, labels and headings Controls Data Entry Text box, List box, Combo box, Radio buttons, Check boxes,Numeric UpDown, MonthlyCalendar,DateTime Picker Navigation Ribbon, Menu bar, Tool Strip, Button, etc. Support Controls Minimize, maximize, close, scroll bars, resize UI Design: Webpages Design Considerations Consistency CSS
Multi-media PerformanceConsiderations Users with Disabilities Assistive technologies Text-to-speech & voice-recognition utilities adapts user interfaces to the special needs of persons with disabilities Make it easy to find information Page titles, Search facility Site Map, Photos Links, Bread crumb trails UI Design: Other Design Considerations Handheld Devices Screen size
Keyboards Touch screens Network capacity App design guidelines Toolkits Handheld Devices Kiosks Dashboards: School District
Creating a Dashboard Corporate Strategic Planning Mission, Goals
Critical Success Factors Key Performance Indicators (KPIs) KPI1 KPI2 KPI3