Post on 30-Jun-2015
description
Magnolia‘s new UX Magnolia Unconference 2012
User experience design What is it all about
User experience - What it consists of
User experience - What it consists of
+ the experience
* holistic
* rememberable* emotional
UX design- Where it draws from
Information architecture
Interaction design
User research and testing
Visual design
Prototyping
+ listen and mediate+ integrate and shape
Usability engineering
UX design is not...
• ... a single discipline
• ... a step in the process
• ... about technology
• ... user interface design
• ... just about usability
• ... just about the user
FlUID research for Magnolia 5
• A world-class experience
• Supports me in my tasks
• Extensible and scalable
• Recognizable
• Inspired by touch devices
• Designed touch first
This is what we wanted to achieve.The goals we gave us at the beginning.But for designing for a UX, this is not enough.
Magnolia has always been a joy to usePerfectly fitting mantra for guiding UX development
- e.g. Instant Preview
- general appearance - focus on the task you‘re working on
Intuitive, where it makes sense, and maybe only after a learning effort by the user(the Trinity Icons aren‘t intuitive, but great, once you‘ve learned them)(the lights system IS intuitive)
Generous in appearance.• generous interface: profits from many years of experience in print design• screens become wider than high: from top, get to content quickly, move actions to sidebar
Fast to use- Dialogs: optimized for fast input- Keyboard shortcuts
Completing the pictureMagnolia 5 UI
A second look at what you‘ve seen
- Apps: -- focus on your tasks-- static part: installed by the customer- Pulse:-- incoming work items-- messages from system and the apps-- live information of the instance- Favorites:-- personalized work space
Hub and Spoke navigation to glue these elements together- allows to visually reduce complexity- introduces flexible, scalable, configurable navigation screen-
Favorites Execute your actions quickly
- personalization of your work space- fast access to often used actions
Dashboard Feel the pulse using meters
Dialogs Optimized for working fast
Optimized with lessons-learned from print graphics:- in general optimized look of dialogs- only certain width makes sense- „show all“ tab allows to edit all fields in all tabs at once
Search and Filtering Just another view
Remains a joy to use
• Faster to work with
• Safe to use
• Easy to extend
• Easy tracking, easy sharing
• Collaboration using Pulse
• Make it direct
• Fun to develop for
• Evolve the user interface
Faster to work with: keyboard shortcuts to launch apps, improve switchingSafe to use: undo/redo, copy/pasteEasy to extend: Content Data appsEasy tracking, easy sharing: followersCollaboration: static workflows vs. unstructured workingMake it direct: inline editing, drag and dropFun to develop for: target developers as user group in future releaseEvolve the user interface: break down app silo barriers
Thanks
Andreas WederHead of UX design
andreas.weder@magnolia-cms.com
@mgnl_uxhttp://ma_ui.blogspot.ch