Archive for the ‘Design’ Category

Socially Conscious Geek: Makin’ Money While Doin’ Good

Lauren Bacon | Thursday, January 14th, 2010

sxswi2010Two years ago, Emira & I went to South by Southwest (AKA SXSW) for the first time, and presented a panel called “Boss Lady” that featured tips for online business owners from several of the savviest women entrepreneurs we know: Vickie Howell, Jenny Hart & Alex Beauchamp, all of whom appear in the pages of our book, The Boss of You. We had such a good time that we knew we wanted to go back as soon as humanly possible, though last year we were too busy getting our book out the door to attend the conference.

But this year we’re back, this time with a panel that we hope will prove helpful to geeks of both the design and techie varieties – both camps are in full force at SXSW’s Interactive conference, which is a pure, 24/7, all-out geekfest – who are looking to bring their values into their paid work, whether it’s by learning to work with clients in the nonprofit sector, creating apps that help mission-driven organizations work more effectively, or infusing some environmental or social-justice savvy into their workplaces. The panel’s called “Socially Conscious Geek: Makin’ Money While Doin’ Good”, and it takes place Saturday, March 13th.

The topic was inspired by a topic our friend Noah Scalin (of Skull-A-Day and Another Limited Rebellion fame) spoke about at the 2009 HOW Conference. His focus was more on graphic design, since that’s his area of expertise, but when I asked him about riffing on his ideas for an interactive design audience, he shared his materials with me with typical generosity. (This is a guy who lives and breathes a DIY, share-and-share-alike mentality that a lot of designers could learn from. But that’s a topic for another day.)

This time I’ll be attending the conference solo, while Emira spends some time with her new baby; my co-facilitator for the session is Leif Utne, a friend and colleague who works for Zanby, a software company that specializes in supporting online social communities for change. Leif’s background includes a stint as the publisher of Worldchanging.org, and lots of experience building online communities; he’s also a journalist, activist and social entrepreneur.  Zanby is used to support The UpTake, a web video community that among other things was heavily involved in documenting the RNC and DNC prior to the 2008 election, and was also engaged in citizen vote monitoring during the election. He brings both amazing facilitation skills as well as a solid understanding of how businesses and nonprofits can work together in mutually beneficial ways.

We’ll be conducting our session in a highly interactive, inclusive format called a Core Conversation: Leif and I will be kick-starting the discussion and planting some seeds, but the idea is that whoever shows up will have a chance to step forward and contribute questions and ideas – so I’m really excited to see how it develops.

We’re hoping to address questions like:

  • What is a socially conscious geek?
  • How can I specialize in socially conscious work and earn a living wage?
  • What are some of the unique opportunities and challenges of specializing in socially conscious work?
  • What is the difference between non-profit and no-profit clients?
  • How do I make the transition from corporate work to working with non-profit and/or mission-driven clients?
  • What is the “triple bottom line” approach to business?
  • What are some examples of alternative business models that are emerging among socially conscious geeks?
  • How is socially conscious work different than “green” work?
  • What are some examples of clients I might be able to work with as a socially conscious geek?
  • How should I market myself to values-driven clients? Is it different from marketing to corporate clients?

Ultimately, though, the decisions about what we cover will rest with whoever shows up. So please help us spread the word – and if you’ll be at SXSW, we’d love to see you there!

Launched: PolicyAlternatives.ca

Lauren Bacon | Monday, December 14th, 2009

Redesigned CCPA home pageWe are very proud to unveil a project we’ve been working on for several months now: a redesign of policyalternatives.ca, the online home of the Canadian Centre for Policy Alternatives. Canada’s leading progressive research institute, the CCPA is a prolific publisher of reports and studies, books, articles, commentary and fact sheets on issues ranging from income equality to environmental policy, privatization of public services, and beyond.

They are highly respected, but like many organizations working towards policy change, they don’t always reach as broad an audience as they might hope; not many people have the time and inclination to read an in-depth research report, so in recent years they have been creating more bite-sized, easy-to-digest content in both written and multimedia formats. As the range of content has grown, though, so has the need to cross-reference related materials — so the CCPA’s website needed to both invite visitors to browse through an extensive library in an intuitive and approachable way, but also allow people seeking more in-depth content to locate related materials quickly and easily. (One of our developers describes the complex interrelationships between the CCPA’s publications as “like Facebook for documents.”)

Their five year-old website, although rich in content and highly trafficked, didn’t offer visitors any way to easily share the CCPA’s content with their social networks, whether through Facebook or Twitter, or even through their own publications, blogs or presentations. Exchange of ideas is the CCPA’s raison d’etre, so it stands to reason that above and beyond extending the website’s “share this” features, the organization would benefit from encouraging online visitors to use and share its content — and they do, using a Creative Commons license.

This project was a complex one on several fronts, as we wrestled with improving navigation through the site (both via menus and site links as well as with improved search tools); updating the site’s look and feel; and migrating the extensive site content (along with the aforementioned relationships between content items) from a commercial CMS platform into Drupal.

Oh, and we also set up a shopping cart (for books, memberships, donations and journal subscriptions).

There’s a real sense of accomplishment here at Raised Eyebrow when we look at the final result, but of course on the web, there’s no such thing as a final edit. Our best hope, in fact, is that we’ve helped to create a solid platform upon which the CCPA can continue to build and extend over the coming years. So while right now we are celebrating the grand opening, the real fun in some ways is still to come. I’m sure we’ll see the CCPA continue to play a leadership role when it comes to presenting research online in accessible and innovative ways.

The Big Reveal: Recent Launches at Raised Eyebrow

Lauren Bacon | Tuesday, October 6th, 2009

The past few weeks have been quiet here on our blog, and as often happens, that silence has been an indicator of just how busy things have been here at Raised Eyebrow headquarters. We’ve been putting the final touches on some exciting new websites that we’re very proud to share with the world. Two major redesigns have just launched – one for a wonderful nonprofit group here in British Columbia and the other for a foundation that’s changing the face of lung cancer research across the United States.

Deaf Children's Society of BC - home pageThe Deaf Children’s Society of BC offers programs, support and resources for families of young children with hearing challenges that range from parent groups for new parents of deaf or hard of hearing infants, preschool and summer programs for young kids, to a library and bookstore where families can access print resources. Their small staff includes several speech-language pathologists and sign language instructors, and they came to us looking to extend the reach of the services they are able to offer through the web. We helped them extend their resources online through the use of instructional videos for new parents to learn sign language that can then be used with their children as they develop language and reading skills.

The new website is a clean but cheerful home for their fun, informative, instructional videos as well as detailed information about the society’s programs and services. Parents can learn sign language in child-sized portions – with signs grouped in themes like animals, colours, numbers, and of course the alphabet, which they can then use to help their young children with developing language skills.

Uniting Against Lung Cancer home pageUniting Against Lung Cancer is a nonprofit foundation that formed in 2001 as Joan’s Legacy, in honour of 47 year-old New Yorker Joan Scarangello McNeive, who never smoked, but died after a valiant battle with lung cancer. Her family and friends rallied and established the foundation to fund research and raise awareness about the disease; over the years it has attracted partnerships with other family foundations, and now Uniting Against Lung Cancer serves as a connector for groups across the United States who are raising awareness and funds. To date, the foundation and its partners have awarded over $6 million in direct research grants in 20 different states.

We worked with Uniting’s staff and board to develop and implement a transition strategy for their online presence, as they re-branded from Joan’s Legacy to Uniting Against Lung Cancer. The new website better reflects the scope and reach of the foundation’s work, and showcases their mission, partners, and events in a design that evokes a deep breath of fresh air on a sunny day.

On a technical note: Both sites run on Drupal’s open-source CMS platform, which gives them a strong foundation on which to develop future site enhancements – something that’s increasingly top-of-mind for our clients. We’re finding that more of our clients are looking at an iterative approach to making site adjustments, and even after a major redesign such as these ones, there are often “wish list” items that we can add to a site over time. We find Drupal provides a robust framework that allows this iterative approach to work well.

New launch: BC Centre for Disease Control

Lauren Bacon | Friday, June 26th, 2009

BC Centre for Disease Control screen captureWe’re delighted to announce that the BC Centre for Disease Control has launched their new website. The BCCDC provides a wide range of services for British Columbians that extend far beyond the “hazmat” image many people have when they think about disease control. They offer STI testing clinics that are open to the public, critical information about diseases and conditions from Anthrax to Zoster, and leading-edge research and statistics on a remarkable breadth of topics.

The new website takes an enormous amount of information and makes it remarkably accessible and easy to navigate; and although we would love to take credit for that, it was Analytic Design Group who provided information architecture consulting on this project — and they did a fabulous job indeed. We provided the graphic design for the new site, which needs to balance the BCCDC’s position as a source of authoritative scientific information with its role in public outreach. Our design approach was therefore guided by the client’s vision of helping to make British Columbia the healthiest place on earth; you won’t see any glaring red or other “emergency” symbols (although we did work in a space for emergency alerts that can appear across the entire site at a moment’s notice), but rather a warm, welcoming, and accessible look and feel that reflects the BCCDC’s collaborative approach to public health.

We would also be remiss if we didn’t credit the technical team at the Provincial Health Services Authority, who really outdid themselves on this particular project. This was a major team effort and we are grateful to have played our part!

Drupal Coda Book

Colin Calnan | Thursday, June 4th, 2009

I’d been itching to try out Coda as my development tool, and their recent 3 day sale meant I got a copy for $45. It’s pretty good so far, I have a couple of issues with it that I’ll cover in a later post. One really nice thing about it is the Books feature. This allows you to add reference material to your Coda development environment and search it without having to go to a browser. I’m always needing the Drupal API, well I actually use this one http://drupalcontrib.org/, which is a brilliant Core and Contrib API, perfect for those tricky Views or Webform moments. Setting up a book is really easy, and here is a screen shot of the settings for a book for Drupal 5 and Drupal 6.

Drupal 5 Book settings
Drupal 5 Book settings
Drupal 6 Book
Drupal 6 Book Settings

I also created a nice little Drupal Book icon from the PSD that I found here which was linked to from here (tips on how to insert coda books).

Drupal Coda Book Icon
Drupal Coda Book Icon

Direct link to book icon

Ideas worth spreading require many languages

Lauren Bacon | Wednesday, May 13th, 2009

TED, purveyors of mindblowing talks by some of the world’s most visionary thinkers (and most engaging speakers), made a big announcement today: they’ve launched their Open Translation Project, which currently provides subtitles for TED talks in 40 languages.

Translating content is not revolutionary in and of itself — although as someone who has worked on multi-language websites, I can tell you that successful translation efforts require a truly mind-boggling amount of careful planning and even more careful execution — but TED has done something very interesting here, that’s worth a closer look for anyone providing rich content and hoping to reach a broad audience.

The translations are made possible through the efforts of volunteer translators. Here’s how TED is handling quality control:

Rather than simply translate a few talks into a handful of major languages, TED and technology partner, dotSUB developed a set of tools that allow participants around the world to translate their favorite talks into their own language. This approach is scalable, and — importantly — allows speakers of less-dominant languages an equal opportunity to spread ideas within their communities.

To seed the site, a handful of talks were professionally translated into 20 languages. But all translations going forward will be provided by volunteers. At launch, volunteer translators had already contributed more than 200 published translations (with 450 more in development). These volunteers range from well-organized groups working together in their own language, to lone translators working individually and matched by TED with others.

To help ensure quality, we generate an approved, professional English transcript for each talk. (This is the transcript upon which all translations are based.) Once the talk is translated, we then require every translation to be reviewed by a second fluent speaker before publishing it on TED. TED controls the final “publish” button. All translators and reviewers are credited by name for their work. After publication, we provide feedback mechanisms for ongoing discussion or improvement around the translation.

I find that second-to-last sentence noteworthy, as well: “All translators and reviewers are credited by name for their work.” I watched a sweet little emoticon story that was translated by a fellow named Clement Genzmer, whose profile page lists the three talks he has translated, as well as talks for which he has reviewed the translation. (Importantly, the links to those talks also credit a co-translator/translation reviewer.)

Not only does TED provide subtitles for each talk, but they have also developed interactive transcripts that enhance the TED experience from all kinds of perspectives:

Along with subtitles, every talk on TED.com now features a time-coded, interactive transcript, which allows users to select any phrase and have the video play from that point. The transcripts are fully indexable by search engines, exposing previously inaccessible content within the talks themselves. For example, searching on Google for “green roof” will ultimately help you find the moment in architect William McDonough’s talk when he discusses Ford’s River Rouge plant, and also the moment in Majora Carter’s talk when she speaks of her green roof project in the South Bronx. Transcripts will index in all available languages.

I can see these transcripts being of enormous benefit to visually impaired users (although the transcripts do not, to my knowledge, include descriptions of visual elements such as slides shown during the presentations, which is an obvious limitation), as well as people watching videos more than once, who may want to skip directly to a particular point in a video.

I’m incredibly impressed with TED’s efforts to make their content more accessible to people everywhere, and with the methodology they’ve used. I do see one oversight, however, which is that I would love to see them include sign-language interpretation, to allow deaf people a richer TED experience. Perhaps once they’ve seen some success with written translations they will explore the idea of offering picture-in-picture sign language interpretation — this, too, could be volunteer contributed.

Green: The Colour of Cyberpunk?

Lauren Bacon | Wednesday, February 18th, 2009

Designers like to talk about the language of colours: the way different colours make us feel, the symbols they’re linked to (e.g. purple = royalty, Easter, etc.), and how they relate to each other. Lately I’ve been thinking about green — and today I noticed something about green I hadn’t noticed before: It’s got some serious traction in the cyberpunk world.

This morning I met with a client who is debating the use of green for their website. Green’s a tricky colour, because depending on the shade, it can evoke freshness and vitality or organic earthiness — or if you veer too far into the yellow spectrum, you hit upon tones that get pretty acidic. There are sectors where green is such an obvious choice it’s almost cliche, as our environmentally-focused clients can attest; whereas in healthcare, for instance, there’s resistance to anything smacking of “hospital green” or colours that might hint at sickness.

So I’ve been thinking about finding the right green, something that’s fresh and grassy, maybe a little citrusy, but without too much yellow in it. And then I had one of those odd moments where I was surfing around and caught a curveball, which has sparked a somewhat random thought: Is there a shade of green (or more accurately, a palette of greens) that’s cornered by cyberpunk?

Here’s the image that sparked my imagination:

Pia Guerra's portrait of William Gibson

It’s a portrait of author William Gibson, AKA The Father of Cyberpunk, by Vancouver artist Pia Guerra. (I found the image — and it’s worth clicking through to see it at a larger size — on this amazing website, which includes work by many of my favourite comic book artists, of which Guerra (co-creator of the excellent Y: The Last Man) is one. Apologies if I’m violating any copyright laws here — I’m hoping it’s cool to reproduce it here for the sake of discussion.)

Screen from The Matrix

I love this piece. It’s strong and evocative, and it has a beautiful texture to it. And the colours instantly caught my eye, because they feel like perfect Gibson colours. I didn’t know why, at first, but as I sat looking at it, I flashed to the iconic visual from The Matrix: the cascading columns of ASCII characters. (Thanks to Wikimedia for this image.)

The Gibson portrait uses subtler greens, but they are similar enough, especially set against black — and the brushstrokes in the portrait have a downward impetus (especially on the sleeve, coming down from the shoulder) that feels very Matrix-y to me. All of that, of course, is entirely apropos for an image of a writer without whom, arguably, there would be no Matrix movies. (Aside: there’s also a Keanu Reeves link between Gibson & The Matrix, since Reeves starred in the film adaptation of Gibson’s Johnny Mnemonic, but that’s neither here nor there.)

Lode Runner, Level 23So I got to thinking about green as colour-code for high-tech. There’s an obvious explanation (if my thesis holds water), which is that at least for those of us of a certain age, our earliest experiences with computers involved a lot of green and black. (See image at left, which comes from sial.org, where there is a remarkable repository of Lode Runner information.) The green-on-black monochromatic computer monitor is mostly gone now, though in my travels today I learned that apparently some people enjoy resetting their monitors to look that way even now. However, its existence coincided with the early days of cyberpunk, so maybe the visual association was established then and has carried through from that point in time.

(A sidebar: I noticed in checking out film stills from The Matrix that many of them share a greenish cast, which is also kind of interesting. Not sure whether that’s relevant to today’s discussion or not, but I’m throwing it out there.)

Otomo: Akira artworkI’m going to add one more image in here, which might be a stretch, but I love this movie, in all its dystopian-future glory, and it uses green to great effect. Here’s a still from the Akira graphic novel series, from which the film was adapted. The artwork is by Katsuhiro Otomo. It’s another cyberpunk classic… do I detect a theme?

 


t. 604.684.2498 | f. 604.721.4007 | e. turningheads [at] raisedeyebrow.com