Design, UX and Theming

Theming a site is NOT doing a grid, modifying the CSS & changing a bit of HTML - Theming starts when the first field is created!

This is where Design, UX, Drupal stuff, functionality and content (read: user input *argh*) all comes together as a big "happy" family - or rather all wanna have its say, and nobody wanna take the responsibility for all the stuff nobody thought of.
Its a battleground where quick n dirty solutions will hunt you down in about 6 months, decisions that were made in the start process (and all forgot about) now is a problem.

Intended audience

Questions answered by this session

What's a themer's role?

What to do when the design is not a grid

Why you should use a basetheme.

When to code, when to {display:none}.

Why custom markup is so important, to be able to do

session_final.pdf

Theming is not rocket science, but it can be difficult being a themer on Drupal projects that are larger in scale. Often you find yourself being pulled into projects at an especially unfortunate moment, or maybe you’re the lucky one that gets included from the start, but without a clear overview as to what the IA, design or basic functionality looks like.

Intended audience

This session is intended for front-end developers and designers or project managers looking for better ways to utilize a themer. Those unfamiliar with Drupal, will gain an insight into the workflow required to create a strong theme, and ultimately an entire website.

Questions answered by this session

How to design and build a theme that works with Drupal and not against it.

How to identify and use the basics within a design, minimizing the need for constant design iterations.

How to use HTML5 and CSS3 to your advantage.

How to use a themer more efficiently.

How to start designing in the browser and use your skill set more efficiently.

WebTypeDrupal_JPamental.pdf

Arial's days are numbered, and we should all celebrate. Come learn about the evolution of web font embedding, how it works, what it can do for your site and your users, and how to make the most of the biggest advance in design for the web since the deprecation of the blink tag.

Intended audience

Designers, design directors and front-end developers - we'll cover why we should use web fonts and how to make it easy to incorporate in our workflow

Questions answered by this session

Why should I use font embedding?

Where does it work (or not) and on what?

How do I do this in Drupal? (To module or not to module)

I'm a developer - how do I make this not kill my page load time?

Should I host or use a service for embedding?

design-web-systems-final-2011-08-24.pdf

Update 2011-08-25: Slides can be downloaded here. Due to file size restrictions, we had to remove many of the image-heavy slides. You can download and view the full slide deck on SlideShare.

Intended audience

This session is intended for anyone who has had to create or implement sitemaps, wireframes, and mockups. Those unfamiliar with Drupal will learn what Drupal "wants" to do and will be able to more easily prepare these materials, and those who already work with Drupal will learn tips and tools for managing the expectations of clients whose designs haven't been optimized for Drupal.

Questions answered by this session

What should a designer know about a project before architecting a site or creating its look and feel?

Why are sitemaps, wireframes, process flow diagrams, and mockups important, and what are they supposed to communicate?

What happens when you're given a design that wasn't created with Drupal in mind?

What are the challenges a design firm faces when they aren't the ones implementing their design?

What tools and techniques can be used to accelerate the design process in Drupal?

Brands grow organically and often undergo complete re-design. How do you prepare for change and build a scalable brand? Our session will show how, when you theme effectively, Drupal has the power to grow with a brand and make design changes simple.

We will talk about:

• Tools and processes for envisioning the brand and the theme
• Creating smart markup
• Thinking in systems rather than ‘pages’, and building sustainable software
• How the right tools can help you (CSS libraries, base themes, helper modules)

Intended audience

Experienced themers, module developers, designers, project managers.

Questions answered by this session

How to get more control over templates, and for instance, prevent tons of overrides when you have many views that require custom markup

How to make CSS systems (Or: why Drupal’s HTML is actually awesome)

How do I ‘design for Drupal’?

How can I use Drupal to manage brand assets?

How do I as a project manager, get the most out of my team?

Presentation v2.pdf

When you are actively working on theming in Drupal, you definitely know how should theme an item list or a table. But, there is a big difference between being able to theme most things in Drupal and really knowing what you are doing and why you are doing it. This is like mathematics. Understanding the logic behind your tools, helps you with creating solutions for problems you've never seen before.

Intended audience

Themers, who already know what they want to do, but do not always know how, and more importantly, do not always know why.

Questions answered by this session

How does the Theming API work under the hood?

How can I use the Theming API the best way?

What is the role if the theme engine in the whole theming process?

What cool stuff can be done using process and preprocess functions and how do they work?

How does the concept of base and sub themes work in the API?

forensic-theming-drupalcon-london.pdf

The theme of your website has the capacity for beautiful, semantic markup...and also the hacky HTML soup. You can build a new theme by downloading a free theme and tearing out its guts--or you can learn how to become a theme surgeon.

Intended audience

Small business site builders who partner with graphic designers but have no idea how to make Drupal look like a design file. Intermediate themers who start with a free Drupal theme that looks "close" to the final site and then start hacking to make their theme. The audience currently does not use base themes and are frustrated at how complicated all of the code is. They are looking for shortcuts and some quick-fix solutions to make theming faster and more profitable.

Questions answered by this session

What are the key tools I need to use to make themeing Drupal easier?

How can I make Drupal markup less yucky?

Where should I start when building a new theme?

Yeah, but how do I theme *that thing*?

I want to see how you build a theme: show me!

of_constraints_and_capabilities_v2.pdf

In software design and development we often overlook the role of our customers in applying their own capabilities to achieve their goals, often creating solutions that are bloated, complex, and inefficient. We are also prone to look at constraints as obstacles rather than opportunities to bound and clarify the services we offer. By applying systems thinking, designers and devlopers can create idealized designs that deliver the most value to customers and businesses alike.

Here are the presentation slides and speaker notes:

Intended audience

Those who design, plan, architect, and evaluate software and digital services.

Questions answered by this session

What is systems thinking, and why is it important?

How does an idealized design differ from other types of design?

How can a mental model help in designing and architecting software?

Why are constraints good?

How do I know what my audience can and will do for themselves?

DCL-UMN-Usability.pdf

Three years after our first round of formal usability testing on Drupal 6, the UX team returned to the University of Minnesota in May 2011 to uncover usability issues and patterns for Drupal 7. After making broad changes in D7, it was critical for us to validate if we are inching forward in our goal. With this aim in mind, we tested eight participants and asked them to perform some tasks. All the participants were site builders with no experience with Drupal.

Intended audience

Attend this panel presentation if you are interested in usability, understanding the user experience and the usability road map for Drupal 8.

Questions answered by this session

How was the study conducted?

What was tested?

What works well and what needs improvement in D7?

How was the overall experience for our users of using D7?

What does this mean for Drupal 8?

Final Presentation_for distribution.pdf

This session will cover:

• Methods to flush out requirements and uncover both good and bad ideas
• Tools and methods to accelerate user interface design
• Tools and methods to test designs for accuracy and measure for continued improvement

All of the above will provide you with tools and processies to ensure that you are both building to meet your customers needs by making informed design decisions, and getting better over time.

Intended audience

Designers looking to learn to accelerate their artform Developers looking to include design, or some of it's user centered practices into their artform Business or product owners looking to build products that map to user needs and improve over time

Questions answered by this session

How can I make sure that my work improves the product I'm working on?

How can I weed out bad ideas and focus on good ones? What processes can I put into place to validate my thinking?

What tools can help me during the lifecycle of concept to creation?

How can I accelerate my design practice while including feedback from my peers and users?

How is Acquia applying this to Drupal. What are we doing to ensure our contributions are good ones?