This article contains 25 images. You will find them at the very end of the article.

This article contains 5449 words.

Speakers & Sessions | Web Directions South 2012

Design

Lea Verou

css in the fourth dimension

Lea has a long-standing passion for open web standards, and has been often called a “CSS guru”. She loves researching new ways to take advantage of modern web technologies and shares her findings through her blog, lea.verou.me. Lea also makes popular tools and libraries that help web developers learn and use these standards. She speaks at a number of well-known international web development conferences and writes for leading industry publications. Lea also co-organized and occasionally lectures the web development course at the Athens University of Economics and Business.

CSS2.1 was two dimensional: There was no concept of depth or time. CSS3 brings us some control over both, with transitions and animations for the latter. In this talk we will start from the basics of these new specifications, but will quickly move to more advanced tips and tricks to fully leverage these exciting technologies. The talk will follow Lea’s trademark presentation style with live code examples, that has been praised by audiences all over Europe.

Andrew Fisher

Data responsive design

Andrew Fisher is deeply pas­sion­ate about tech­no­logy and is con­stantly tinker­ing with and break­ing some­thing — whether it’s a new applic­a­tion for mobile com­put­ing, build­ing a robot, deploy­ing a cloud or just play­ing around with web tech. Some­times he does some real work too and has been involved in devel­op­ing digital solu­tions for busi­nesses since the dawn of the web in Aus­tralia and Europe for brands like Nin­tendo, people­sound, Sony, Mit­subishi, Sports­girl and the Mel­bourne Cup.

Andrew is the CTO for JBA Digital, a data agency in Mel­bourne Aus­tralia, where he focuses on cre­at­ing mean­ing out of large, chan­ging data sets for cli­ents. Andrew is also the founder of Rocket Mel­bourne, a star­tup tech­no­logy lab explor­ing phys­ical com­put­ing and the Web of Things.

Big data, analytics 2.0, click stream analysis, heat mapping — if the volume of buzzwords are anything to go by, the golden age of data and the web is well and truly upon us — but what does this mean for us? On the web we swim in oceans of data and we have access to surprising amounts of it — sometimes you might even take a look at what Google Analytics is saying, and of course you’re mining all of those web site log files for gold aren’t you? As web practitioners are we all suddenly statisticians and data scientists now?

As our applications have become more complex, we’re all used to async processing in order to keep our UIs responsive and our users happy but besides just processing a transaction and responding what could we be doing with all this data?

Using the ideas of responsive design this session looks at how we can take some of the tools and techniques being used on the “big data” side and start injecting them responsively into our web applications to create more interesting and meaningful experiences for our users. This session won’t be about statistics or data science, instead it will be focussed on what you can do now, provide examples of how you can take your applications further and how you can use data to tailor responsive designs and experiences based on user behaviour.

Karen McGrane

Adapting ourselves to adaptive content

If the internet is more awesome than it was in 1995, Karen would like to claim a very tiny piece of the credit. For more than 15 years Karen has helped create more usable digital products through the power of user experience design and content strategy. Today, as Managing Partner at Bond Art + Science, she develops web strategies and interaction designs for publishers, financial services firms, and healthcare companies.

Prior to starting Bond, Karen built the user-centered design practice at Razorfish in her role as VP and National Lead for User Experience. Karen is also on the faculty of the MFA in Interaction Design program at SVA in New York, where she teaches Design Management, which aims to teach students how to run successful projects, teams, and businesses.

For years, we’ve been telling designers: the web is not print. You can’t have pixel-perfect layouts. You can’t determine how your site will look in every browser, on every platform, on every device. We taught designers to cede control, think in systems, embrace web standards. So why are we still letting content authors plan for where their content will “live” on a web page? Why do we give in when they demand a WYSIWYG text editor that works “just like Microsoft Word”? Worst of all, why do we waste time and money creating and recreating content instead of planning for content reuse? What worked for the desktop web simply won’t work for mobile. As our design and development processes evolve, our content workflow has to keep up. Karen will talk about how we have to adapt to creating more flexible content.

Josh Clark

Buttons are a hack

Josh Clark is a designer specializing in mobile design strategy and user experience. He’s author of “Tapworthy: Designing Great iPhone Apps” (O’Reilly, 2010) and “Best iPhone Apps” (O’Reilly, 2009). Josh’s outfit Global Moxie offers consulting services, training, and product invention workshops to help creative organizations build tapworthy mobile apps and effective websites.

Before the internet swallowed him up, Josh was a management consultant at Monitor Group in Cambridge, Mass, and before that, a producer of national PBS programs at Boston’s WGBH. He shared his three words of Russian with Mikhail Gorbachev, strolled the ranch with Nancy Reagan, hobnobbed with Rockefellers, and wrote trivia questions for a primetime game show. In 1996, he created the uberpopular “Couch-to-5K” (C25K) running program, which has helped millions of skeptical would-be exercisers take up jogging. (His motto is the same for fitness as it is for software user experience: no pain, no pain.)

Touch gestures are sweeping away buttons, menus and windows from mobile devices—and even from the next version of Windows. Find out why those familiar desktop widgets are weak replacements for manipulating content directly, and learn to craft touchscreen interfaces that effortlessly teach users new gesture vocabularies. The challenge: gestures are invisible, without the visual cues offered by buttons and menus. As your touchscreen app sheds buttons, how do people figure out how to use the thing? Learn to lead your audience by the hand (and fingers) with practical techniques that make invisible gestures obvious. Designer Josh Clark (author of “Tapworthy”) mines a variety of surprising sources for interface inspiration and design patterns. Along the way, discover the subtle power of animation, why you should be playing lots more video games, and why a toddler is your best beta tester.

Craig Sharkie

Responding to responsive design

Craig has been a regular at Web Directions South since before it was Web Directions South. He’s moved from the audience, through moderation, and on to being a presenter.

Along the way he’s released the second edition of his book with Earle Castledine, jQuery: Novice to Ninja, and has toured the East Coast capitals delivering HTML5 workshops. That’s all of course when he wasn’t founding SydJS and organising monthly events for 100 or so of Sydney’s keenest JavaScript programmers. All the while he’s been working at some great companies, with even greater people.

No matter what you do, your design is going to be responsive. Even if your response is to ignore Responsive Design, that’s still a response.

We’ll look at a range of techniques and attitudes – and even an application or two – that will make simply ignoring Responsive Design harder than embracing it.

From the server to Media Queries and beyond we’ll look at taking the big R from Responsive and making at a big ahhhh!

It’s not about Mobile. It’s not about the Desktop. It’s about time we moved beyond 2.0.

Development

Douglas Crockford

Programming style and your brain

Douglas Crockford was born in the wilds of Minnesota, but left when he was only six months old because it was just too damn cold. He turned his back on a promising career in television when he discovered computers. He has worked in learning systems, small business systems, office automation, games, interactive music, multimedia, location-based entertainment, social systems, and programming languages. He is the inventor of Tilton, the ugliest programming language that was not specifically designed to be an ugly programming language. He is best known for having discovered that there are good parts in JavaScript. This was an important and unexpected discovery. He discovered the JSON Data Interchange Format. He is currently working on making the web a secure and reliable software delivery platform. He has his work cut out for him.

Computer programs are the most complicated things that humans make. They must be perfect, which is hard for us because humans are not perfect. Programming is thought to be a “head” activity, but there is a lot of “gut” involved. Indeed, it may be the gut that gives us the insight necessary for solving hard problems. But gut messes us up when it come to matters of style. The systems in our brains that make us vulnerable to advertising and propaganda also influence our programming styles. This talk looks systematically at the development of a programming style that specifically improves the reliability of programs. The examples are given in JavaScript, a language with an uncommonly large number of bad parts, but the principles are applicable to all programming languages.

Stoyan Stefanov

Javascript performance patterns

Stoyan Stefanov is a Facebook engineer, ex-Yahoo, architect of the performance tool YSlow2.0 and creator of the image optimizer smush.it. He’s the author of the books “JavaScript Patterns” and “Object-Oriented JavaScript” and contributor to “Even Faster Web Sites” and “High-Performance JavaScript”. He curates the Performance Advent Calendar.

Today JavaScript is the second largest contributor to the page load size (after images, source). But while images only affect first impressions, JavaScript can make your app slow for as long as the user interacts with it. It’s therefore critical to understand and tame JavaScript performance.

This session looks at both page delivery and user interaction to highlight patterns and areas of improvement starting with proper benchmarking and profiling. Understanding what to improve (e.g. DOM manipulation) is as valuable as understanding what not to bother with (e.g. unrolling loops) We’ll also look at some of the new and shiny in HTML5 and ECMAScript5 and how certain features affect performance, e.g. data-* attributes, localStorage and various “shims”.

Chris Lienert

Building and breaking web forms with quaid-js

Chris Lienert has been doing all sorts of things to innocent web sites for 15 years and is also responsible for unleashing web forms library Quaid-JS upon the world. He is currently leading the in-house web team for insurance broker Jardine Lloyd Thompson in Perth.

Aside from musical distractions and earning frequent flyer points, Chris and his wife Sarah can often be found in the company of their very small human.

There’s little worse than trying to fill out a form on the web only to find a site error won’t let you submit it. Given that web forms are the fundamental way of providing data interaction on the web, it’s critically important that your forms are easy to use and work every time.

Based on 11 years’ experience with web forms, Chris Lienert has done the groundwork for you and wrapped it up in a light-weight, open source library. Quaid-JS embraces and extends HTML5 Forms to help build robust and user-friendly web forms.

Troy Hunt

5 things you absolutely, positively need to know about web security

Troy Hunt is a Software Architect and Microsoft MVP for Developer Security. Troy has spent the last 17 years building web applications and now specialises in software architecture and security. He blogs regularly about security principles in software development at troyhunt.com, is the author of the OWASP Top 10 for .NET developers series and recently the free eBook of the same name. Troy is also a regular speaker and the creator of ASafaWeb, the Automated Security Analyser for ASP.NET Websites at asafaweb.com.

Organised crime, nation states and the rise of the “hacktivists”; these days there’s an increasing queue of people lining up and knocking on the door – or just breaking right through the door – of your websites. Whether it’s a targeted attack or indiscriminate automation, the stats show that most websites contain at least one serious security flaw and the average site contains hundreds of them!

Most of the time it’s the same flaws which are leaving our websites vulnerable and the mitigations are tried and tested – they’re just not well understood and consistently applied. This session is designed to take a look at what some of those key vulnerabilities are, some high profile cases of how they’ve been exploited and what you need to do to protect your site against them. This is a technology-agnostic presentation and the content is equally relevant across web frameworks.

Tim Gleeson

The monster music mash

Tim Gleeson is a front end developer from Funke Labs. He has been creating websites for the past 5 years venturing into both UX and Ruby on Rails. In his free time, Tim hacks together all sorts of things but never lets them see the light of day.

Using the power of the Audio API to show how to mix and mash audio files together to create interactions between the audio and elements within the page.

Tammy Butow

Do more with less (css)

Tammy is studying a Master of Computer Science at RMIT and is the co-chair of @GGDMelb. She also spends her time making HTML5 mobile apps, travelling, blogging and filming music videos for chuckingamosh.com.

Let’s have a look at how LESS extends CSS with dynamic behaviour such as variables, mixins, operations and functions. You can use LESS to do more on both the client and server side.

Sebastiano Armeli-Battana

Lazy load everything!

Sebastiano Armeli-Battana is a Software Engineer living in Melbourne and working as consultant and web freelancer. He has developed and designed applications using different programming languages — JavaScript, Java, Ruby — but is most passionate about JavaScript and web development. He is the author of a jQuery plug-in called JAIL and he also enjoys speaking at conferences and writing technical articles. Sebastiano holds a Master Degree in Software Engineering from Polytechnic Institute of Milan.

This session will present an approach where resources such as scripts and images are lazy loaded for improving the performance of a web application. Loading a resource can be an expensive operation, so being cautious will make all the difference in terms of performance.

Myles Eftos

Single page web apps: a practitioners guide

Myles is a Perth-based web and mobile developer. He has been developing web stuff for over a decade, working both server and client side. He wrote a book on Mobile web development, and lately he’s been working on native apps.

Single page web apps have come in to their own now that we can store data locally on browsers using local storage and application caches. But how do you build them? In this session we’ll discuss the architecture of a single page app, how to structure them, and what you can use to help you build them.

Mark Dalgleish

Prototypal inheritance in javascript

Dalgleish works as a front-end developer in Mel­bourne. He’s obsessed with everything web and loves using JavaS­cript, CSS and HTML to cre­ate rich exper­i­ences that res­on­ate with end users. In his spare time, he loves exper­i­ment­ing with the latest web tech­no­lo­gies, shar­ing pro­jects online and helping others learn progressive web development techniques.

In this bold new world of rich JavaScript applications running on both the client and the server, the need to structure our code in more object-oriented ways becomes apparent. One potential roadblock many people face is that, instead of the traditional “classical” inheritance model, JavaScript features prototypal inheritance hidden behind a misleading classically-styled syntax. We will compare the two approaches, review some popular design patterns and see why JavaScript’s inheritance model is in many ways more powerful than what you might be used to.

Graham Weldon

Creating 3d multiplayer games with javascript

Graham is a PHP developer of 12 years, a well known public speaker internationally on the web and PHP circuit, and a core developer for the CakePHP framework. He has a long standing interest in gaming and game development, and enjoys teaching people techniques as much as developing them. Graham has been doing 3D Javascript for about 2 years and enjoys realistic environment generation and realtime networking.

With the rise of browsers as viable platforms for high quality rendering and speedy Javascript, it opens a path for developers to produce and deploy great games with minimal effort. I will demonstrate a basic network layer, rendering infrastructure, and control system to implement a realtime, 3D, in-browser multiplayer game platform with Javascript that any web developer will understand and be able to extend upon.

Elle Meredith

Smarter css with sass

Elle is a web designer and developer with a passion for web standards and a unique background that bridges the gap between the front– and back-end. She employs best-practice techniques to deliver clean, functional and user-friendly websites. In 2007, she discovered Ruby and has since been building web applications with Ruby, Rails, Haml, Sass, Coffeescript and other such awesome technologies.

Sass is a compiler of CSS, has been around since 2007, adds useful programming constructs to CSS and is becoming a standard for authoring stylesheets. Sass enhancements make CSS more versatile by eliminating duplication of common style patterns, allowing style logic to be reused and thus making your stylesheets easier to maintain.

In this session you will learn practical Sass tips and best practices for making your projects easier to build and simpler to maintain. The session will cover Sass basics, how to leverage the power of Sass mixins for cleaner code, tips on how to use Sass for responsive grid layouts by using Sass functions and media queries, how to use Sass alongside Compass efficiently and lastly review a few boilerplate examples with suggestions on how to structure your assets files.

Damon Oehlman

Better than mvc

Damon Oehlman is an experienced web and mobile applications developer. He has worked with small and large companies to develop software solutions for desktop, web and most recently mobile devices. His first technical book, Pro Android Web Apps, was released earlier this year by Apress. Damon currently runs his own software development and consulting firm Sidelab, which specializes in cross-​​platform mobile solutions. Damon’s aptly titled tech blog Distractable offers a mix of articles, tutorials and other shiny things. He is a proud dad, husband and one day dreams of owning his own underground lair.

There is so much hype around MVC and so-called MVC frameworks at the moment. Is the hype really worth it though? Does the MVC pattern really help us build lightly-coupled, extensible web applications. In this session, Damon will stir the pot on modern web application architecture and challenge you to think about other approaches before picking up the MVC hammer.

Arunan Skanthan

Roll-your-own (style guide)

Arunan is a proud to be a Geek; but believes he is really good at talking to humans; just as he is with machines.

When he’s not a designing or developing interfaces, ranting about web standards or being obsessive about *nix & Apple products; he can be found serenading his neighbours with my musical skills, shooting anything & everything (with a camera of course!), cooking spicy food or doodling penguins everywhere. Oh yeah and he plays “Heroes of Newerth” like a boss!

Arunan will rant be talking about his experiences of working with existing and legacy projects, that have poor or no documentation; why style patterns help you learn, do less tedious work, and make you a “rock– star” in the eyes of future developers of what you are working on now; and how to make your own style-guide framework.

Big picture

Alex Young

Losomo: enhancing location, social, mobile with situation, context and content

Alex Young is co-founder of MOB, an R&D lab in Sydney. MOB create apps, multi-device platforms, Augmented Reality and Computer Vision solutions for customers as well as their own products that are used around the world. MOB is active in the AR standards community globally and work with businesses to provide them hands-on experience using emerging technologies to get a look ahead at what the impacts to their organisations and customers will be.

Prior to MOB, Alex spent 10 years heading up UX, Design and Development teams across Interactive TV, Web and Mobile, primarily in Telco-land.

Not so long ago seeing where you need to go on a map, where you currently are or checking in with your social platform of choice defined “location”. The very notion of a location as just being a point on a map is dead. We are moving into an era where location can give us content specific to where we are at a micro level, the time of day, your situation at that point in time, and not just in relation to outdoor environments or places. Now we will start seeing an explosion of indoor location based experiences come-to-life.

In this session Alex will define what “location” means, how emerging technologies and the changing expectations and behaviours of people are realising new and increasingly richer location-influenced experiences. She will also discuss how this further impacts privacy, with organisations not only knowing your location at a certain time and place, but being able to track you over a period of time and what specific interactions you have at different locations — think “real-world” Google Analytics.

John Allsopp

What we talk about when we talk about the web

With a background in computer science and mathematics, and a great deal of good fortune, John Allsopp’s life collided with the web in the early 1990s.

For nearly 20 years he has developed software for web developers, built web sites and applications, written books like Developing with Web Standards and the first ever book on Microformats, and written countless articles and tutorials for print and online publications.

In 2000, he wrote “A Dao of Web Design”, which over a decade later continues to be widely cited as the theoretical foundation for Responsive Web Design.

John continues to develop software, websites and applications, tutorials and articles, and to deliver workshops online and in person. He co-founded the Web Directions conference series, and in his copious free time likes to trail run, mountain bike, play what most of the world calls football, and be as good a dad as possible to three beautiful young daughters.

He lives in the bush, overlooking the ocean, a little outside Sydney, and considers himself very fortunate indeed.

Over its two decades, the web has passed through two epochs, each heavily informed by technologies and practices that came before.

The “pre-cambrian” age was the web of pages. Our design practices were informed by the tradition of print design. As developers we were creating in essence “interactive paper.”

Over time we learned to distinguish where the legacies of print design helped us, and where they held us back.

While this era continues, a second, described by Scott Jensen as “Jurassic”, is upon us. The age of apps. Just as print informed our design of web pages and sites, the decades&emdashlong history of developing apps weighs heavily on the web applications we are building today.

And just as web designers and developers needed to learn from, and in part discard the tradition of print, so too now do we need to learn from, and in part discard the tradition of apps. Only then will the web find its true self.

But what might this more “pure” web look like? For users? For developers? For designers? What technologies will we need to build it? Can we start building it today?

In this presentation John Allsopp, author of A Dao of Web Design, considered by many as “a manifesto for everyone working on the web” will outline what he believes are the foundational principles of this web, and look at existing, as well as emerging technologies available to designers and developers to start building the once and future web.

Matthew Sheret

The bit between data and you

Matthew Sheret regularly describes himself as a ‘copywriter’. In the last few years that’s seen him writing interface copy, essays, comics, press releases, radio scripts, infographics, positioning statements and talks. He’s done that for the likes of Thomson Reuters, Dentsu, and Lego.

In 2010 he became Last.fm’s first Data Griot, a kind of in-house storyteller, contextualising user behaviour for people inside and outside of the company.

Matthew edited the independent comics anthology Paper Science for three years, and in 2011 was selected as the Writer-in-Residence for the Thought Bubble Sequential Arts Festival. In his spare time he plays with Lego.

I’m tired of our relationship to data being mediated by pie chats and sparklines. And I think you are too. After all, the data-trails that we leave as we check-in, scrobble and microblog our lives aren’t lumps of numbers; they’re an (im)material trace of the things we do.

So, how can we play with data to offer genuinely new perspectives on the things we’re doing? And what stories are emerging as we do that?

Using comics, cutaways and a few well-placed Markov chains I’m going to look at the new spaces opening up in the gap between data and storytelling.

Kynan Huges

Stop your agency sucking at web development with this one weird old tip

Kynan is Technical Director at The Monkeys (B&T Agency of the Year 2010 & 2011, Australian Creative Hotshop 2010 & 2011, Campaign Brief NSW Agency of the Year 2011). He lives on the NSW Central Coast and prefers to work from home but doesn’t get to often enough. A qualified sculptor, Kynan has done web development for agencies, telcos, startups and clients of various kinds since some time in the previous millenium.

Creative agencies are traditionally terrible at doing web development. They don’t even call it web development, they call it “digital”. Developers who work for agencies know this because they repeatedly find themselves slugging away at the wrong end of a process that leads to missed deadlines, dissatisfied clients and developer burnout.

Nearly every project suffers from some or all of the same problems:

• crazy short deadlines
• rock star creatives pushing ill conceived ideas
• unreasonable client expectations
• budgets that get used up before development starts
• all nighters night after night after night
• producers who think project management means asking a developer “how’s it going?” fifty times a day

I’ll spell out the structures and processes that must be in place to actually do development properly in this peculiar environment. I’ll also tell you who in the organisation can make these changes happen.

And the rewards?

• Projects finished early and on budget
• You in the pub on launch day
• Happy clients who want to to work with you again

Charlie Gleason

You are a developer, the internet is your friend

Charlie Gleason is a developer, designer, photographer, writer, musician and video game enthusist. Having studied both design and computer science, he has worked as a technical lead, lead developer and senior designer in Melbourne, London and Perth. He spends his spare time building web apps, talking about the internet and roaming around Azeroth looking for loot.

Unfortunately, he does not tan.

The internet is getting really, really big and developing it means knowing more than ever before. Do not fear: from programming languages to social networks, application frameworks to responsive design, the ever growing bucket of buzzwords that threaten our collective sanity are far less troublesome than they initally appear.

So how do designers take the plunge? What are the tricks that everyone seems to know but no one seems to tell you? And do developers really work in text editors?

As a designer turned developer, quasi-nerd turned internet ninja, and now buzzword aficionado, Charlie Gleason will tell you the secrets to how he learnt to stop worrying and love the code. With helpful tricks, tips, and a tragic overuse of puns, he wants you to be as amped about the web as he is.

Joy is all but guaranteed.

Keynotes

Amber Case

From solid to liquid to air

Amber Case is a cyborg anthropologist and user experience designer from Portland, Oregon. She has been featured in Forbes, WIRED, and many other publications, both in the United States and around the world. Her main focus is mobile software, augmented reality and data visualization, and reducing the amount of time and space it takes for people to connect. Case founded Geoloqi.com, a powerful platform for real-time location based services, out of a frustration with existing social protocols around text messaging and wayfinding. Case has spoken at TED on technology and humans and was featured in Fast Company 2010 as one of the Most Influential Women in Technology. She’s worked with Fortune 500 companies at Wieden+Kennedy and on major applications at Vertigo Software.

We are tool using creatures. Prosthetics touch almost every part of our lives. Until recently, humans have used their hands and bodies to interface with objects. Early interfaces were solid and tactile. Now, the interface can be anywhere. The best interfaces compress the time and space it takes to absorb relevant information, and the worst cause us car accidents, lost revenue, and communication failures. We increasingly live on interfaces, and it is their quality and design which increases our happiness and our frustration.

This speech will discuss how the field of anthropology can be applied to interface design, and how future interfaces, such as the ones employed by augmented reality, will change the way we act, feel and communicate with one another.

Surprise Guest

Are we there yet?

* title may change

Secret Keynoter

How soon is now?

* title may change

Mystery Speaker

The future of the future*

* title may change

W3c

Once again, together with the W3C Australia Office we’ll be hosting the W3C South track, featuring eight in depth sessions on current and emerging W3C standards.