drupal product 3 is the magic number
DESCRIPTION
Three suggestions for a better initial experience using Drupal core.TRANSCRIPT
Drupal core product,3 is the magic number
Drupalcon Denver 2012
Roy Scholten
@royscholten
Volcanos--
D8UX
Give newbies (first) and experts (second) a good initial experience
But, how?
Tested on live humans
Blank canvas isnot a helpful start
D8UX
Give newbies (first) and experts (second) a good initial experience
Design principles
1.Easy first, powerful under the hood2. Connect the dots3. is the magic number
1. Easy first: provide onramp
2. Connect which dots?
2. Connect the dots
I
http://drupal.org/project/portfolio
Us
http://drupal.org/sandbox/eaton/1324728
Gaghilversum.nl
Butler
??
Butler
Onramp for developers
Example code for the framework? Dsm().module? SDK's?
Do it! (we're in research phase)Portfolio
#79582
#497804
Snowman
#1210366
#282404
g.d.o
#213563
Butler
? :-)
Thank you!
Drupalcon Denver 2012
Roy Scholten
@royscholten
Google usability test report – http://groups.drupal.org/node/218959
Portfolio – http://drupal.org/project/portfolio
Shapes of stories – http://www.youtube.com/watch?v=oP3c1h8v2ZQ
Lessons from Drupal 3 – http://chicago2011.drupal.org/sessions/lessons-drupal-3
Usability work – http://groups.drupal.org/usability
The ad-free brand – http://www.amazon.com/Ad-Free-Brand-Building-Successful-ebook/dp/B005GVH1DC/ref=cm_cr_pr_product_top
1
Drupal core product,3 is the magic number
Drupalcon Denver 2012
Roy Scholten
@royscholten
2
3
Volcanos--
I was supposed to give a previous version of this talk at core conversations in San Fransisco.
I kinda did over Skype, but I want to do it for real too.
4
There was a strict format to how to propose a core convo then. 4 slides
5
6
7
9
D8UX
Give newbies (first) and experts (second) a good initial experience
While discussing heuristics for Core, he suggested this.
Good is a bit more realistic than delightfull
10
But, how?
Of course, the question is how
11
Tested on live humans
Well, we can check how Drupal first impressions are currently
13
No
the Laocoön Group, Vatican Museums, Rome.100 BC
It shows the Trojan priest Laocoön and his sons being strangled by sea serpents.
14
Hmmmm…
The google usability test team just released a great report on what is causing people to falter
15
Blank canvas isnot a helpful start
For me it boils down to this
16
D8UX
Give newbies (first) and experts (second) a good initial experience
So, how do we do this?
17
Design principles
1.Easy first, powerful under the hood2. Connect the dots3. is the magic number
So, how do we do this?
18
1. Easy first: provide onramp
Provide a clear path of entry.
You drive slower there,and there are fewer lanes there.
19
2. Connect which dots?
The ui is fragmented and unweighted. If we don't have an idea of what we want to help people to achieve, we need to be more specific and concrete.
20
2. Connect the dots
Children's drawing yes, but a couple essential elements in place:
– some parts filled in– a background prop to give things perspective– you are sure you are going to make it and know what you'll end up with
21
The main question to answer when trying to provide a better initial experience is to say WHO we're targetting.
We want to be as specific as possible here, but to help start framing this I've been thinking around three high level use cases
22
Me, me, me!
Of course we all know designers are the most ego-centric bastards of all, so
Us – Then there's this small group of people that work together to get something done and tell the world about it
World – The most philantropic of all of course are developers. But only to achieve world domination. Aka as the 'anything' scenario. (where abstract flexibility comes from)
Lets look at each in a bit more detail.
23
I
http://drupal.org/project/portfolio
It's human nature for people to think about themselves first. Why not hook into that and provide people with a starting point to get their own work out there
– Professional portfolio
24
Spend time on this at the design camp in Berlin last year. Main objectives:
– contact– show work/expertise
There's a fun spreadsheet out there that explores specific variations of this. Look up the portfolio project and you'll find an issue that links to this.
25
Personal example:
I make etchings and monotypes.I showcase them on a core-only install
Using a subtheme of Seven, 50 lines of CSS
Responsive and everything!
(demo)
26
Us
http://drupal.org/sandbox/eaton/1324728
Snowman
This hits at the core of what the Drupal project is all about.
27
There's a lot to learn from the 'Lessons from Drupal 3' talk Ken Rickard did a couple years ago
I have another core-only example site for this
28
Gaghilversum.nl
This is the simple website I set up for the studio where all the printing takes place.
Again, I made a simple css-only theme for it, other-wise it uses core functionality only
29
Butler
??
I'll need your ideas for this one.
Don't lose sight of the fact that we are all uber-uber-experts in all things Drupal.
Smart developers new to Drupal will need guidance too.
Not everything for that should be as features or example code in core, but it'd be nice to have something in place that shows of the fabulous new architecture and APIs available
30
Butler
Onramp for developers
Example code for the framework? Dsm().module? SDK's?
31
I think these three high-level use cases provide a useful framework (ha!) to think about this.
32
Do it! (we're in research phase)Portfolio
#79582
#497804
Snowman
#1210366
#282404
g.d.o
#213563
Butler
? :-)
This is rough, But like Dries mentioned in his keynote, we have a month or 2 to further explore these things. And we can work on configuring
33
34
35
Thank you!
Drupalcon Denver 2012
Roy Scholten
@royscholten
36
Google usability test report – http://groups.drupal.org/node/218959
Portfolio – http://drupal.org/project/portfolio
Shapes of stories – http://www.youtube.com/watch?v=oP3c1h8v2ZQ
Lessons from Drupal 3 – http://chicago2011.drupal.org/sessions/lessons-drupal-3
Usability work – http://groups.drupal.org/usability
The ad-free brand – http://www.amazon.com/Ad-Free-Brand-Building-Successful-ebook/dp/B005GVH1DC/ref=cm_cr_pr_product_top