rebuilding from the ground up - drupal · pdf filerebuilding from the ground up garrett ......
TRANSCRIPT
Rebuilding From The Ground Up
Garrett CoakleyHead of OnlineWhale and Dolphin Conservation
email: [email protected]: @garrettc
Thursday, 6 June 13
HelloThis is the story of what we’ve been doing at the WDCS for the past 2 1/2 years, namely completely rebuilding our web presence.
What led us to that decision, how we approached it, and Drupal’s role in it
Hello WorldThursday, 6 June 13
We’re an international organisation located in 6 countries. Head office in Chippenham, Dolphin centre in Spey Bay, scientists in the US, Argentina, and campaign staff in Germany
“The user is going to have an experience on your site, whether it's good or not is up to you”
Thursday, 6 June 13
So, what were the issues?7 years oldCustom CMS, fragmentation, sprawl
Multiple designsThursday, 6 June 13
Multiple designsDuplicate contentWide *and* deep structure.
Multiple designsThursday, 6 June 13
Multiple sitesThursday, 6 June 13
Separate sites for other languages. Left behind on design.
Multiple sitesThursday, 6 June 13
This can cause a second class experience
Multiple sitesThursday, 6 June 13
External blogsSilo’d from the main site and each other.
Multiple sitesThursday, 6 June 13
Duplicate content (German team translating Charlie’s posts)No overview of activities
Multiple sitesThursday, 6 June 13
Species guide, incredibly highly trafficked part of the site. Stuck in 970x480 fixed dimension div.Overflow: scrollBroken on small screens.
“The user is going to have an experience on your site, whether it's good or not is up to you”
Thursday, 6 June 13
What to do about the mess?Knew we had a custom CMS with no ongoing developmentTried to do a content audit, gave up. Not a good use of my time.We made the decision to raze it to the ground, save the historical content (blogs/news), trash everything else.Where to start?
Staff workshopsThursday, 6 June 13
13 workshops over 9 weeks. Trips to Scotland and Germany. Question: “Imagine the most amazing WDCS website you can”Post-up and Affinity map exercisesGamestorming
ResultsThursday, 6 June 13
It was apparent early on that many departments had aligned needs but it took someone with an outside view to see the common threads
ResultsThursday, 6 June 13
This is from the combined notes of all the workshops.
A common theme expressed by all participants was that it was too difficult to find resources in the current site, even for those members of staff that had been using it for a while. Useful content was frequently lost or misplaced. It was also failing to communicate our core principles and mission.
Another theme was the lack of editorial control teams had over their content and the difficulty in keeping things up to date, not due to human factors, but instead the lack of tools and workflows.
So that was the staff, what about the general public?
"Who are you to your customers? What do you do for them?
How can you embody that digitally and provide that service or information wherever they might need it?"
Josh Clark (@globalmoxie)
Thursday, 6 June 13
An important question, who are they?
Animal lovers, Enthusiastic amateurs, Conservationists, Students, Science professionals, Policy makers, Other organisationsHow to appeal to everyone? Is it even possible?
Who are our supporters?Thursday, 6 June 13
We decided to phase development: Phase 1, existing supporters. If we get it right for them there’s a good chance will get it right for the wider audience. Later phases will address other audience facets.
ResearchThursday, 6 June 13
I had a rough idea in my head of what the new site had to do, I think it’s important to have a vision. We set up card sorts in Optimal Sort and also ran some user surveys to see if my ideas were sound. While it’s important to have a vision it’s also important to be willing to be proved wrong.
ResultsThursday, 6 June 13
The results showed a tendency towards a very narrow but deep picture of the organisation with a number of common clusters, namely: The work of the WDCS, About the WDCS, How people can get involved
The responses from the feedback form identified similar issues to the ones from the staff workshops; that the site was difficult to navigate, too busy, it was also failing to communicate our core principles and mission. Why people should support us.
Where organisation needs align with supporter needs that's a good thing, but where they're different the supporters win (GDS design principle number 1 - “Start with needs. User needs not government needs)
“Great content meets users’ needs and supports key business objectives. It engages and informs. It’s well-written and intuitively organized. It keeps people coming back for more.”
Kristina Halvorson (@halvorson)Content Strategy for the Web
Thursday, 6 June 13
For us the content revolves around the core narrative of the site. Issues, Our Work, Get involved.
It’s not just about money, although that’s a big part of it, it’s about creating ambassadors, informed participants.
We need to structure our content. This is a mobile first, content out strategy.
Structured contentThursday, 6 June 13
What do we mean by structured content. Distinct, reusable elements. Canonical pieces, address the redundancy issue. Know that if you change something in one place, it will update everywhere.
“We should build networks of content, not of pages. Design is now the relationship between individual components, not rigid pages.” - Ethan Marcotte
Enter Drupal
Structured contentThursday, 6 June 13
A content type is made of fields, some fields are common, some are unique to a content type. control what goes into those fields.
I set strict limits on the contents of fields. Synopsis has no formatting. If it isn’t clear without bold or italics, rewrite it.
Structured contentThursday, 6 June 13
Synopsis: wrap up the issue in a paragraph Talking points: The elevator pitch. limited to 5 itemsFrom those two sections you should have enough info to decide if you want to help, or have a discussion in the pub, or around a dinner table with your friends. Deeper into the page - supporting content
So now we have confidence in the content, how do we package it?
Going back to Josh Clark’s quote, how can you provide your service or information where ever people need it.
“Think of your core content as a fluid thing that gets poured into a huge number of containers.
Get your content ready to go anywhere because it’s going to go everywhere.”
Brad Frost (@brad_frost)
Thursday, 6 June 13
Over 200 unique screen sizes and resolutions, and more to come.
Progressive Enhancement, responsive design
Responsive designThursday, 6 June 13
Why responsive design?
“It’s not a fad. It’s a legitimate attempt to address the massive challenge of delivering great experiences to this explosion of devices and browsers” - Brad Frost
It’s not a silver bullet either, it’s early days, but you should understand the techniques, have this in your toolkit.
Responsive Web Design by Ethan Marcotte, Adaptive Web Design by Aaron Gustafson - buy them.
Responsive designThursday, 6 June 13
I hadn’t tested for this, but it worked. there’s some flakyness with the logo, but nothing major, it just works.
Responsive designThursday, 6 June 13
This is in a pub. You can do some great guerrilla testing in a pub.
Responsive designThursday, 6 June 13
Don’t think of linearising your content. Start with the small-screen/mobile context and then expand on that.
"The abscence of support for @media queries is in fact the first @media query" - Bryan Rieger
In short, we should strive to create and present content in ways that respect the fact that even when they’re using the web, people need to pee.
Erin Kissane (@kissane)The Elements of Content Strategy
Thursday, 6 June 13
What Erin is referring to here is that we’re all still primates, biological entities, we have to make allowances for the hundreds of disabilities and interruptions that plague our lives.
Don’t think mobile vs desktop. Think more about context, what do people want to do. I use my iphone more sitting on the couch than I do when I’m out and about.
