For a Good User Experience UX Design Goals, Methods, Tools & Tales William Washington | Washington Kevin Makice| Indiana Kuali Student UX

Next-generation People-centric Rich user experience Kuali Student Vision

Getting from here to there Development Evaluation & Adoption Use Here Functional Needs User Needs Experience

DevelopmentAdoptionUse Design (iterations) PrototypeEvaluate Analysis “Requirements emerge as users begin to see the evolving design...when they see what you're building, they'll say what they meant.” - Alan Cooper User Centered Design is a solution

Useful Usable Desirable The Goals of UCD “Design is not just what it looks like and feels like - Design is how it works.” Steve Jobs

A design discipline that is implemented through UCD Concerns itself with all aspects of a person’s experience with a product: behavior, form, and content. User Experience Design (UX)

Simplicity User Control & Freedom Orientation & Exploration Good metaphors The UX Perspective Consistency & Standards Error prevention & recovery Good feedback Efficiency of use Good help, when needed

Core Team: UX Strategy, Design Patterns, Navigation Architecture, etc. UXA & Sr. UX Designer on Core team Parallel Delivery Teams: Delivery of functional areas UX Designer on each Parallel Delivery Team UX team & methodology are in place

Kuali Student is moving toward Agile development. The system functions evolve from simple to complex through iterative development. UX and UCD must fit into an Agile process Iterate Backlog & prioritize usability and functional enhancements Backlog Design & Develop simplest solution Evaluate through implementation

The user interface of KS is built on an evolving Rice foundation – KRAD. Gaps exist… …between what KRAD can do and what KS needs. …between what KRAD can do and what developers can do. Gaps must be tracked and managed. UX must work within technical constraints

Design patterns & style guide UI templates & stencils for rapid prototyping Well-managed UI framework gaps Successful UX in an Agile context UIM Axure Library

Design patterns are time-tested solutions to recurring design problems. User Interface Model (UIM)

Development Quality Assurance Collaborative Design UXDevPO Backlog UIM The UIM is a key resource for PDT collaboration. Helps UX make UI decisions Provides sample code to Developers Reveals known gaps to help PO prioritize Vision for the UIM

UIM UI Patterns Early Analysis UX Principles UXDevPMUXDevPO Patterns are defined and validated User research identifies new design needs Core analysis expresses desired user interfaces PDT Development reveals real-world interaction solutions Building the UIM UI Patterns PDT Development Collaborative Design & Development Core

UIM UI Patterns KS Kitchen Sink KRAD DevUI DevUX Building the UIM SMEUsers Validate UIM through user testing OR Mock Code Our collective knowledge is stored in the UIM. UX research informs the rationale for what we need to build Kitchen Sink validates what can be built PDT iteration reveals new patterns to validate

Axure is software for wireframing and rapid prototyping of web and desktop applications. Applying the UIM to Axure widgets

Axure Library UX The Axure widget libraries help UX build wireframes quickly. Encapsulates KS knowledge of the UI Matches current visual design Provides higher fidelity interactivity for rapid prototyping Vision for the Axure Widget Library Development Quality Assurance Collaborative Design Backlog

Axure Library Widgets are built in response to design decisions in UIM. Reflects current supported function and visual design Includes desired (but unsupported) UI behavior Requires periodic updates by a UX designer Building the Axure widget libraries UX UIM UXDev

UX in Action: An example What do I do with this information? Where do I go?

Brainstorming with the UIM

Mockups with Axure

The State of the UIM New Platform Rice Platform (KRAD)Google Web Kit June 2012 KD12 “Finished ” Initial UIM Future Desired Validated # Patterns & Components Gap Desired 2009 UI Developers

The State of Axure widget libraries New Platform Rice PlatformGoogle Web Kit June 2012 KD12 “Finished ” Initial UIM Desired Validated # Patterns & Components Future Gap

UCD methods must fit into Agile development process UIM and Axure widgets encapsulate knowledge for quick design & prototyping Functional gaps in the UI framework must be well managed For a good user experience in KS

“Finish” the UIM Document what we want/know Dedicated UI Developer resources More user input as part of the process Incorporate user research into methodology Evaluate UIM patterns with real users Next Steps

Done! Photo: Questions?

Photo: Bonus!