1. Redshift’s Big List of SXSW Interactive 2014 Parties

    image

    Redshift is heading to SXSW Interactive (SXSWi) this week and we thought you might find our big list of parties helpful. You’ll want to RSVP for these fast because they’re filling up quickly. See you in Austin!

  2. I desperately hope someone from Muni sees this.

    Great job Derek Kim!

  3. The NYTimes.com Redesign: A Redshift Review

    image

    It is well known that the New York Times has a crackerjack interactive design team, so any time The Grey Lady shakes out her skirt the design community takes notice. Here at Redshift we thought we’d weigh in on the first refresh to the .com since 2012.

    What we love:

    The Front Page

    Breathing room - The entire site feels more open and approachable. They obviously spent a fair bit of time optimizing the type and layout for greater readability.

    Hamburger navigation- By finally embracing this mobile convention, the NYT was able to create a persistent yet discreet location for newspaper sections and subsections.

    Section hierarchy - A lot of news sites do this poorly with only two levels, or worse, just a list of links. The New York Times leads the viewer through the page with where to start first and where to go next. It may sound trivial but it’s actually pretty important when your site is mostly text.

    Removing blue linked headlines- Mobile has trained users to tap anywhere they expect to be interactive. By the same token, desktop users have been trained to rollover anything they think might be interactive. This design trusts that the underline is enough feedback to garner the click. 

    Web fonts- The distinctive fonts and quirky typography of the print edition finally return to the Times with the adoption of web fonts. 

    Article Pages

    Big, bold and faster-loading images- Beautiful images take the forefront. Love the elegant hi-res slideshow implementation as well.

    Clean, streamlined reading experience - I’m not sure that anyone has really cracked the long form read, but this is a nice try. The wide gutters and lack of distracting sidebar content allow you to focus on the articles.

    Sidebar comments- A great solution. I love that you can scan the comments and quickly reference the article in line. Not sure why some articles have this feature and others don’t.

    What we don’t:

    The Front Page

    Small images - Imagery is still too small on the homepage. Let the lede have the big beautiful image it deserves.

    Massive ads - I suspect the Times kept the  front page images small so that they wouldn’t compete with the new ad format. Ads are here to stay, but the half-screen animated pop-over ads are intrusive and jarring.

    Still cluttered - The slavish attempts to mimic the print edition means the front page is still pretty busy. 

    Personalization - There is none. The signed-in experience doesn’t get you anything beyond an acknowledgment of your existence as a subscriber.

    Article Pages

    Redundant intra-article navigation - The ability to navigate between articles using the arrows keys is nice. But I just clicked on an article, why do I need to see a list of those same articles at the top of the screen?

    Redundant links - 3 ways to get Home. 2 ways to Share. 2 ways to select the next article, etc. 

    Roll-over activated short cuts sidebar- the elegant solution on the front page is given a heavy handed outline and roll-over activation. Unnecessary and frankly, ugly.

    The take away

    Overall, this redesign is a move in the right direction. However, in their attempt to bridge the gap between print and digital, the Times doesn’t quite go far enough towards innovating content consumption. The underutilization of images and integrated multimedia especially seems like a missed opportunity. But the layout continues to improve and the experience on the whole is far more enjoyable. Looking forward where they go next.

  4. Think Different: iPhone Apps that Break the Mold

    One of the things we do best at Redshift is iOS app design. We’re always looking for innovative examples of iPhone apps that live outside the box—apps with unique interfaces, novel user experiences or fantastic usability.

    This is what most iPhone apps look like:

    image

    image

    Features like the navigation bar, hamburger icon and sidebar are all part of the tried-and-true, standard app template.

    Here are 10 iPhone apps that break convention:

    1.  Listen: The Gesture Music Player

      image


      Listen’s gesture-based interface is so simple that you can shuffle through music with your eyes closed.

      Check out the app in use.

    2. Writer (multilingual)

      image


      Writer is a gesture-based writing app. The designers kept Writer extremely minimal to eliminate distraction. They also completely redesigned the keyboardit’s optimized for mobile.

    3. Proust

      image


      Proust lets you rank items from best to worst and compare your sorted lists with friends. It’s rainbow, addictive and filled with unicorns.

      The promotional video is… interesting.

    4. Noted

      image


      This simple, gesture-based app helps you create and delete notes with minimal effort.

      You can get a good feel for it here.

    5. Clear

      image


      This elegant to-do list app lets you manage lists using only gestures. With Clear, you don’t have to deal with cluttered navigation. Just swipe, pinch and pull to control all of your to-do items.

      Check out the beautiful interface here.

    6. Taasky

      image


      Taasky’s sleek transitional interface helps you sort to-do items with ease.

      Watch it in use here.

    7. Spendee

      image


      Spendee’s impressive animated interface helps walk you through the app. The action buttons pulsate and ripple, and the preloaders are slick motion graphics rather than out-of-the-box iOS spinners.

      Check out Spendee’s features here.

    8. Duolingo

      image


      This gamified language-learning app boasts an elegant, bubbly animated interface. On top of Duolingo’s sleek UI, the Wall Street Journal calls it “best free language-learning app” out there.

    9. Castro

      image


      Castro is a podcast app with gesture-based navigation, streamlined play controls and a beautiful iOS 7 interface.

      The app’s novel features are explained here.


    10. Yahoo News Digest

      image


      Yahoo uses diagonally cutoff images, parallax swiping and sleek animations to make daily news catch-up fun and easy.

      The app’s unique design is illustrated here.

  5. You know Dasher and Dancer and Prancer and Vixen, Comet and Cupid and Donner and Blitzen. But do you recall, The most famous reindeer of all?Rudolph the Dead-Nosed Reindeer

    You know Dasher and Dancer and Prancer and Vixen,
    Comet and Cupid and Donner and Blitzen.
    But do you recall,
    The most famous reindeer of all?


    Rudolph the Dead-Nosed Reindeer

  6. Anna is quoted in The Times

    Anna Bleker, the newest member of the Redshift team, just got quoted in the NYT. Read it here.

  7. Very cool little live action video that almost makes you nostalgic for Apple’s iOS skeuomorphic interface.

    Very cool little live action video that almost makes you nostalgic for Apple’s iOS skeuomorphic interface.

  8. Literature and Design

    In a recent Creative Meeting, we looked at the relationship between design and literature - how cover and book designs help reinforce literary moments, and how literature has inspired designers of all kinds.

    To warm up, we collected some of our favorite, or most memorable covers. 

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

    image

  9. A Primer on Gamification
"Gamification" gets tossed around a lot these days, touted as an easy way to make an experience more fun and rewarding (I mean, sure, aren’t games always more fun than not-games?), but finding good examples of what it really means to make an experience more game-like, or how to incorporate subtle game techniques into designs are hard to find. 
During a conversation about an internal mobile project here at Redshift (I will say no more!), a good friend and fellow designer Bill Jordan recommended the following article on gamification. It’s short and sweet, but a great primer for why gamification matters (hint: because what will emotionally engage your audience is at the core of user-centered design), and how you can start thinking about it in your own designs today. 
If, for example, your app requires a user to fill out a profile before getting to the fun stuff, consider the following: 

"We experimented with the wording of questions, to humanise them, make them more engaging and link them to potential real-world emotional experiences. For example, instead of asking somebody to tell us the clothing they liked to wear, we asked them what clothing they would wear for a first date. Instead of telling us where they liked to go on holiday, we invited them to imagine that they had to publish a magazine offering holiday recommendations.The results were instructive: there were two or even three times as much feedback to the more engaging questions and consistently more time taken in providing the answers."
"A question such as "describe yourself" yielded on average 2.4 descriptors and effectively 85% of respondents answered. When that question was adjusted to deliver the challenge of, "describe yourself in exactly seven words" the descriptors increased to 4.5 and the response rate rose to 98%."
"When we asked respondents to make a list of their favourite foods, we received an average of six items in response. When we told them they had two minutes to make a list of their favourite foods, not only were respondents conditioned to spend the arbitrary two minutes allocated, but it also produced an average of 35 items in reply." 

Full article here: http://www.theguardian.com/media-network/media-network-blog/2012/aug/15/online-market-research-gamification

    A Primer on Gamification

    "Gamification" gets tossed around a lot these days, touted as an easy way to make an experience more fun and rewarding (I mean, sure, aren’t games always more fun than not-games?), but finding good examples of what it really means to make an experience more game-like, or how to incorporate subtle game techniques into designs are hard to find. 

    During a conversation about an internal mobile project here at Redshift (I will say no more!), a good friend and fellow designer Bill Jordan recommended the following article on gamification. It’s short and sweet, but a great primer for why gamification matters (hint: because what will emotionally engage your audience is at the core of user-centered design), and how you can start thinking about it in your own designs today. 

    If, for example, your app requires a user to fill out a profile before getting to the fun stuff, consider the following: 

    "We experimented with the wording of questions, to humanise them, make them more engaging and link them to potential real-world emotional experiences. For example, instead of asking somebody to tell us the clothing they liked to wear, we asked them what clothing they would wear for a first date. Instead of telling us where they liked to go on holiday, we invited them to imagine that they had to publish a magazine offering holiday recommendations.The results were instructive: there were two or even three times as much feedback to the more engaging questions and consistently more time taken in providing the answers."

    "A question such as "describe yourself" yielded on average 2.4 descriptors and effectively 85% of respondents answered. When that question was adjusted to deliver the challenge of, "describe yourself in exactly seven words" the descriptors increased to 4.5 and the response rate rose to 98%."

    "When we asked respondents to make a list of their favourite foods, we received an average of six items in response. When we told them they had two minutes to make a list of their favourite foods, not only were respondents conditioned to spend the arbitrary two minutes allocated, but it also produced an average of 35 items in reply." 

    Full article here: 
    http://www.theguardian.com/media-network/media-network-blog/2012/aug/15/online-market-research-gamification



  10. Pixel Pusher

For SF Design Week 2013, REDSHIFT created this interactive “bitmap” using ping-pong balls and rare earth magnets. As the guests experimented with the board over a one-hour period, we captured their creations in a time-lapse video. Thanks to all our participants!

Watch the video on Vimeo:
https://vimeo.com/69907845

    Pixel Pusher
    For SF Design Week 2013, REDSHIFT created this interactive “bitmap” using ping-pong balls and rare earth magnets. As the guests experimented with the board over a one-hour period, we captured their creations in a time-lapse video. Thanks to all our participants!
    Watch the video on Vimeo:

  11. Museums and Technology

    image

    One of our recent creative meetings focused on museums and technology and closed with the following debate: Does museum technology get between us and the experience by becoming the experience itself?

    image

    Augmented Reality, or using digital information to modify a view of reality, is a hot topic right now in the museum industry. Back in 2010, two artists created a lot of buzz with their guerrilla augmented reality show in MoMA, where they exhibited their own work without an invite and were even able to create an additional virtual 7th floor. Here’s their original announcement

    Sander Veenhof and Mark Skwarek cordially invite you to the “WeARinMoMA” exhibition in the MoMA NY, featuring reality art in its proper context: a contemporary art museum. At the same time, the “art invasion” annex exhibition showcases the radical new possibilities and implications Augmented Reality is bringing to the cultural and creative field.

    p.s. The MoMA is not involved yet

    In fact MoMA was never involved and never needed to be - such is the nature of Augmented Reality, where anyone can put together a virtual show and no artwork needs to be physically placed or removed. 

    More recent examples includes bringing dinosaur skeletons to life in the Ultimate Dinosaurs Exhibit at the Royal Ontario Museum, bringing dinosaur skeletons to life or “Who do you think you really are?”, an interactive film at the Natural History Museum in London.

    image

    image

    So what are the pluses to this technology? For one, a visitor can see a piece in its original context instead of a white gallery box. Imagine pointing your phone at a ceramic vase and seeing that vase in a small hut in ancient Rome. Another hurdle this technology is overcoming: Displaying pieces digitally that might not otherwise see the light of day. 

    But for those of us who enjoy quiet and look forward to the meditative gallery experience, those days could be coming to an end. The industry is still in the experimental phase - at this point no one knows what museum visitors need and want in terms of digital enhancements to the museum experience - but the shift is toward interaction, not silence.  

    At Redshift we think the key to success will be finding a way to keep older, more traditional viewers comfortable and younger, tech-savvy viewers intrigued. 

    image

  12. Happy Holidays from REDSHIFT

    Happy Holidays from REDSHIFT

  13. Augmented Reality

    image

    We started this week’s creative meeting with a quick exercise. We each jotted down examples of design problems that are challenging because of the separation between the digital and the physical worlds. Then, we looked at the evolution of Augmented Reality technology. Like most burgeoning technologies, the evolution of AR is peppered with examples of applications best described as gimmicky and useless. We wanted to look instead at the best of the best in order to find ones that either help solve a real need, or at least create a truly unique experience. Our ultimate goal was to identify the types of design problems for which a solution involving AR could be appropriate, either now or in the future (you know, when the technology is better). 

    Here’s what we found. 

    AUGMENTED REALITY THAT ENHANCES ENTERTAINMENT: 

    Harry Potter Deathly Hallows DVDs

    image

    The animated characters that animate from each of the two Deathly Hallows DVDs actually sense each other and start to battle. By taking “augmented packing” to a new level, they gave customers a fun incentive to purchase DVDs for both movies. 

    AR Basketball 

    image

    A sort of AR version of the classic time-killer paper football, this iPhone game puts a mini-mini-hoop right on your desk and let’s you flick virtual basketballs. 

    Topps 3d live trading cards 

    image

    Trading cards are all about showcasing a player, so seeing an animated 3d version of that player pop up on your desktop - and actually play a virtual game with him - is a natural evolution. 

    AUGMENTED REALITY THAT ENCOURAGES CREATIVITY:

    Lost Valentinos music video 

    image

    It’s already fun posing the bandmates in a music video as if they were action figures, but using them to record your own interactive music video for all the world to see is a win. 

    Wrigley’s 5 Gum 

    image

    We’re not sure of the connection between gum and DJ-ing, but Wrigley’s came up with a clever way to create a “virtual” physical instrument that you can actually play and record. 

    AUGMENTED REALITY AS ADVERTISING:

    Vampire Diaries Magic Mirror

    image

    Still one of the coolest uses of AR, pedestrians pausing to look at this billboard for a series about vampires think they’re looking into a mirror. Then poof their reflection disappears. 

    VW Beetle Juiced Up billboards 

    image

    You have to pre-install the app and aim your iPad at the ad, but Volkswagen’s static billboards will come alive in an impressive display of 3d animation. 

    Esquire’s Find Brooklyn Decker 

    image

    Goldrun’s iPhone app gives you rewards for taking fake photographs with celebrities. It’s a bit hard to imagine posing in front of my phone with a celebrity photo, but at least this campaign makes it more of a paparazzi game, driving customers right to the magazine aisle where they are (in theory) more likely to buy Esquire’s latest issue. Generally speaking, this probably works best with kids and animated characters. 

    AUGMENTED REALITY AS UTILITY:

    Holition’s Augmented Retail 

    image

    Holition has a whole line of “augmented retail” experiences. They use printed cutouts that you strap on your body, or facial recognition, to help you try on luxury items such as rings, watches, and sunglasses. 

    USPS Priority Mail Virtual Box simulator 

    image

    The postal service tried a clever solution for all the time and materials people waste selecting the wrong shipping boxes. Just put your item on your desk and slip a virtual box on top. The idea is great, though it’s hard to say if all the prep is simpler than just grabbing a tape measure. 

    Browse AR 

    image

    There are many of these “real life browsers” coming out now, and until something like Google Glasses comes out and removes the need for a viewfinder, their utility is suspect. Yelp’s Monocle might have been the first (and Google Glasses might be the endgame), but they all use GPS and your smartphone’s camera to show you where points of interest are in real time.  

    Word Lens 

    image

    If it worked as well as advertised, this comes as close to magic and a perfect, transparent UX, as anything I’ve seen. Aim your phone at a sign, a document, or any word or words in a foreign language, and this app not only translates it for you in real-time, but replaces the foreign text with the translation. This was our favorite in concept. 

    Conclusions

    With an understanding of the range of modern AR applications, we now reviewed the results of our initial exercise to determine whether any of them would be appropriate for an Augmented Reality solution. We discussed the challenges in knowing the true color of physical objects online, mimicking the emotional depth of face-to-face conversation through video, checking the tactile properties of fabrics and similar items, representing network maps (i.e. real devices in digital space), and of course the ability to taste food and smell perfumes across the web. Challenges with physical space seemed more promising, such as when you’re trying to buy furniture, replacement parts for mechanical objects like a bicycle, or looking at apartment rentals and understanding the size and layout of the rooms. We also discussed the many applications within remote healthcare, and possible ways of using AR to teach someone to play an instrument remotely. 

    image

    But what about the problem of learning how to tie a tie? Drawings on how to tie a tie are confusing and difficult to translate into 3d space. And it’s still a challenge translating the motions of someone in a video to your own reflection in a mirror. AR’s “magic mirror” effect might be able to solve this. It could place a 3d tie on your real-time video and animate itself being tied. Or it could create a semi-transparent tie for each step, allowing you to simply match the shape of your own tie below it, guided by helpful arrows. A fancy version might allow you to manipulate the tie and give you immediate feedback on whether you’re doing it the right or wrong way. 

    In the end, we believe that AR has two big hurdles to surmount if it’s going to hit the mainstream and have real utility. Whether through better algorithms or hardware, it has to recognize and track objects better so we can get beyond printing out all these silly paper symbols. Ideally, this would better help it mimic the dynamic occlusion effect (which would make trying on sunglasses feel a lot better). The second hurdle is the display screen. Mobile phones are an integral part of daily life, but pointing it this way and that in public to view AR content feels just dorky enough to be a barrier. Only when the screens are big enough (digital billboards) or small enough (contact lenses) that the screen disappears will AR really take hold. 

  14. A social mirror

    image

    Think people don’t throw out casual slurs that much anymore? Watching real-time use of the words like “faggot” “so gay” etc. on Twitter might change your mind. Just last week, there  were over 218,000 tweets of the word “faggot.” University of Alberta created the site Nohomophobes Dot Com to show the prevalence of casual homophobia in our society. They’ve asked users to reply with #NoHomophobes to show support and let people know that homophobic language will no longer be tolerated in our society.

    Great design, great data, and great message. Check it out!

  15. Stickies and Lean UX Process

    In a recent engagement, we were tasked with re-imagining the interaction design of a client’s backend platform. In particular the way various types of users manage organizations, teams, and projects. There were a large amount of possible users with varying permissions, needs, behaviors (you know, “use cases”), and tasks. 

    To keep track of everything, we wrote down all the possible scenarios on stickies (one per sticky), and then sorted them by user and task. We used a second color sticky to associate a UI feature with that user’s task. 

    In reviewing, we were able to quickly recognize a pattern in the way users and organizations managed each other that could simplify it into three simple steps, and which could then be applied to the other major management tasks: works, and time-based metadata. The whole system revealed itself as potentially simpler, and showed obvious parallels between the different types of users and tasks. 

    We don’t pretend to use Lean UX tactics or tools in every project, but they have their place. The above exercise was an example of a “dump-and-sort” (dump all your ideas, then sort them) exercise. We’ve found this exercise useful when trying to get a mental picture of a lot of information, particularly when that varying is slight, as is the case often with multiple permission-levels. The single interface that came out of this exercise (after much iteration of course) elegantly accommodated a variety of user types, each with their own set of needs and behaviors.