Upgrade to Pro — share decks privately, control downloads, hide ads and more …

The State of User Experience in Puppet

Randall Hansen
September 29, 2011

The State of User Experience in Puppet

User experience in Puppet is more than just the GUI; it includes the command line, the Puppet language, and our APIs. It's easy to think of these as disparate systems, but it's important to us that they all act like parts of a whole.

Puppet must satisfy the real needs of real users in a high-quality and consistent manner. What are the UX considerations of a command line interface? How can we create a GUI that minimizes clicking? Can we make the Puppet language simultaneously easier to approach and more powerful? How do we know if we've succeeded? What do we do when we fail?

I'll talk about where we meet these goals, where we fall short, and how we plan to improve.

Randall Hansen

September 29, 2011
Tweet

Other Decks in Design

Transcript

  1. The State of User Experience Randall Hansen [email protected] • @sonofhans

    • At Puppet we are taking user-facing design seriously • “We” not “me”: there are 55 of us • It doesn’t matter what I think unless I can convince others • Theme today: Puppet’s UX is reflection of us as a company
  2. John Hansen • Good-looking guy, huh? • He never saw

    my current meth-dealing-biker/Ming the Merciless look
  3. John Hansen • In a biological sense, we’re all here

    ‘cause of our fathers • For me it’s direct; dad was an industrial engineer • Anything broken; gave to me; left sharp edges on (e.g., capacitor) • Tandy 1000SX; office suite; print tiny font • I can solve this; QBasic manual; little program
  4. $ dad • Look on his face when he saw

    the problem was solved • Hooked on solving other people’s problems • So that’s where I come from
  5. What, how, why • UX at Puppet; what we’ve done

    lately • Also how and why; fairly mysterious • Easy to say “seriously”; what does it mean? • Want you to keep us honest • Lots of things fast; time for questions, favorite • Perverse: in reverse order; “why?”
  6. Why UX? • Why does Puppet have UX? • What

    all my friends asked • Interaction? Work on web? Systems tool? • Yeah, mostly CLI, but after 25 years of crappy CLI tools, I want payback • Serious answer: much UX
  7. UX in Puppet • CLI • GUI • DSL •

    APIs • CLI: most of our work • GUI: Dashboard; much dev lately • DSL: model our world • APIs: application programming interface • Ruby API • REST, communicate with services • What holds these together?
  8. User-facing quality • Does it for me? Quality. • All

    sorts of people care about all sorts of things • This is mine: quality of UX • Regardless of what or why, must do quality • Why? Not abstract; not goal of itself
  9. User experience? • What is UX? • Untamed, wrong hands:

    grandiose • Journey through all interactions • Perception of that journey • Trap of “perception” • Sold my soul; run tests like this
  10. [root@pe-centos6 ~]# puppet master --no-daemonize Could not prepare for execution:

    Got 6 failure(s) while initializing: Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet • How does screen make you feel?
  11. [root@pe-centos6 ~]# puppet master --no-daemonize Could not prepare for execution:

    Got 6 failure(s) while initializing: Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet; Could not evaluate: Could not find group puppet • Now how about this one? More cheerful, isn’t it? • Want to see it again? Feel better now? • This is decoration, not design • Good design: prevent error, or make it hard to reach; • At least a useful message; 1 message instead of 6 • Good design; conserve precious resource; time • Stealing time; crappy tools; worst sin
  12. Focus on user • Users are not us • See

    new people come into Puppet; go native fast • We don’t have the same skin in the game that you do • No single user; not monolithic or homogeneous • Different people, contexts, goals • Hopeless? How do we talk about this?
  13. Personas • Great UX tool; talk about type of user

    • GUI, 100 nodes, no DSL: “Joe” • “Puppet & MC ... overwrite ...” • No substitute for engagement or testing • Geek out: fictional narrative, breakfast • Fundamentally decision-making tool • Same types of conversations
  14. Design is making decisions • Important we all speak same

    language • Regardless title/position • Everyone working on Puppet is a designer • Design: making decisions on behalf of someone else • “Designing this” == “deciding so you don’t have to” • More decisions I make; fewer you have to • “... fewer you GET to” ... knock on Apple • Limit choices • Glad Android competes; I like Apple’s decisions • They work for me; crux of it • Good design works for audience; bad design fails. • Very empirical
  15. Who and why • How do we make these decisions?

    Start with framework • Every product, who and why; users & goals • Product & UX; Nigel & I = Wonder Twins • Good enough: set manageable context for R&D • Empowered to make decisions; call specialist
  16. User testing • So that’s the “user” part; “experience?” Inside

    someone’s head? • Usability testing; elaborate or simple • Most important: get them talking. Describe process • When effective? stages of a product/feature • Point of testing: find problems, make changes • Earlier is cheaper; tear up paper
  17. Empowerment • Point? Personas & testing & stuff? • Empower

    the people doing the work. • No great UX top-down, CEO, design, product. No micro • Every day, people building Puppet make hundreds of decisions • Sum of these decisions is the UX of Puppet • Good, smart people, doing their best, foreign territory • Framework; advice; design & user feedback at right time • How do we know it works? What does success look like? • I’ll show you, and it’s really cool
  18. Provisioner [root@centos ~]# puppet node_vmware create -t el56 -n test.lan

    notice: Connecting ... notice: Connected to vc01.puppetlabs.lan as jeffapi (API version 4.1) notice: Locating instance_uuid of template el56 notice: Found instance_uuid 50323f93-6835-1178-8b8f-9e2109890e1a notice: Starting the clone process notice: Control will be returned to you in 10 minutes at 04:06 PM if the process is unfinished. • Do you see it?
  19. Provisioner [root@centos ~]# puppet node_vmware create -t el56 -n test.lan

    notice: Connecting ... notice: Connected to vc01.puppetlabs.lan as jeffapi (API version 4.1) notice: Locating instance_uuid of template el56 notice: Found instance_uuid 50323f93-6835-1178-8b8f-9e2109890e1a notice: Starting the clone process notice: Control will be returned to you in 10 minutes at 04:06 PM if the process is unfinished. • Do you see it now? “Control will be returned to you in 10 minutes” • I had nothing. Jeff McCune. Cloud provisioner for PE. • Email: “I actually spent a few minutes thinking about what the person sitting at the keyboard WANTS to know while the program is sitting there doing something.” • Code is simple; not engineering problem; UX problem • Making the right decision by understanding the user’s context & exercising empathy • Would take a designer prohibitively long to make similar decision. • What is process? How long should take? What’s good timeout? • 150 commands in Faces; more in apps. Top-down design not possible. • Nor is it necessary; if people are empowered
  20. CLI Interaction • Ok, let’s geek on CLI, find interaction

    principles • Big part of Puppet; important that it work well • I’ll do something sneaky; warning you in advance
  21. Immediate feedback • Must provide immediate feedback; hitting ENTER •

    Crusty old sysadmins like yourselves get nervous at silence • Nielsen, 1/10 second responsiveness, high bar on web • At least tell the user that it’s heard her; and what it intends to do
  22. Readable output • Output must be human-readable by default •

    Programs exchange data as they see fit • Contrast, repetition, alignment, proximity • Typography • Don’t believe? Nick Fagerlund’s help for Faces
  23. Actionable errors • Consistently complaint I hear most about Puppet

    • Most errors are Ruby stack traces • Errors must say what went wrong, what to do next
  24. Consistent input • accept input the same way • if

    --keypair works one way in one command ...
  25. Single entry point • SSH fails: ssh-keygen, ssh-keyscan, ssh-agent, ssh-add,

    ssh-yourmom • git, puppet: one command • easy to learn; helpful if you’re lost
  26. GUI Interaction • Immediate feedback • Helpful by default •

    Readable output • Actionable errors • Consistent input • Single entry point • Here’s the trick: all works for GUI • Why? Because designing tools for people, people basically the same. • Ok. Know why; know how. What have we been doing?
  27. Faces • Pretty new; talked at Puppet Camp, now shipped

    • Who knows? Who’s used? Who’s written one? • New API. Expose existing functionality. • Buried but only 6 inches deep. • Kelsey Hightower on Friday
  28. Provisioner $ puppet node_vmware create --template el56 \ --name www1.acme.lan

    $ puppet node install www1.acme.lan • Goal: spin up cloud instance w/ Puppet • With command print on t-shirt • Readable across the room • Takes few minutes; no time to type; Jeff’s feedback
  29. GUI • That’s the CLI. • We’ve done lots of

    GUI work the last 6 months • First, Dashboard reporting improvements
  30. Dashboard 1.1 • Problem: hard to get scannable current state

    • “Dashboard” even implies that • Tried to improve
  31. Dashboard 1.2 • Prettier, but that’s coincidence. 1. Cleaned up

    categories. New ones don’t overlap; no math. 2. Help for new categories. 3. Graph in navigation; info presented 3 ways. Show 0. 4. Removed big warnings. 5. Replaced “recent reports” with tabbed. 6. CSV export link everywhere. 7. Background tasks monitor; importing • Good example of design. No prettier; still useful • Open source Dashboard, version 1.2
  32. Compliance • Two more GUI: built for heretics who don’t

    manage entire infrastructure with Puppet • These are commercial plugins to Dashboard; ship w/ PE • Come to demo for details • Briefly, audit resources • Compare with known good state called “Baseline” • Alert when out of compliance with Baseline
  33. Instant Management • Gotta say, don’t love the name. “Live

    Management” • Friendly GUI to manage MCollective tasks across population • Teaser. • Count of unique users on all nodes: 1 click • All installed versions of a package across all nodes: 2 clicks • Make root user the same on all nodes: 5 clicks, no typing • Come see demo; it’s cool
  34. Puppet module tool • Not completely lame WRT Forge •

    CLI tool for Forge interaction; seen nice improvements • My favorite, for those who know
  35. Puppet module tool $ puppet-module install jamtur01-apache $ mv jamtur01-apache

    • Previously, had to do this. No more. • Not heroes for sinking row-boat, nonetheless • Other nice improvements; check it out
  36. DSL • I ... uh ... like the DSL •

    PC Amsterdam, session, ideas, tickets, user list, feedback • Dropped the ball • I’m sorry; I’ve been busy! • Every month Luke says, “About that DSL, Mr. English Major” • “Hire me another designer ...” • Excellent news. We’re hiring another UX designer • Explicit goal: me spend time with the DSL
  37. API • Only one API thing • Worst thing about

    Dashboard: storing own data • Should be consuming services; been saying a while • Money where mouth is • Instant Management on new tech stack • Batman.js; Sinatra; single-page app; stores no data • Only consumes APIs, makes API calls to affect world • Future of our GUI products