Amazing Animations

I came across an email in my inbox from a year ago.  I had been looking up some examples of animation in mobile UI for some project.  I was surprised at how well these have held up - how great some of these animations still look.  For these first three, I only had the URLs for the images, not the pages they came from, sorry.

Plus, here's a whole gallery of great animated mobile UI.  Even after over a year, these still feel fresh and relevant and in some cases, futuristic (and not just because some project out of the device).

Feed Sift (07/17/2015)

-1-

TWISTEDSIFTER.COM -- 98 Unprocessed Foods Cut Into Perfect Cubes

-2-

SETHGODIN.TYPEPAD.COM -- Capitalism vs. lock in

-3-

ARCHITECTURALDIGEST.COM -- The Most Colorful Buildings (Slideshow)

-4-

PINTEREST.COM -- Backyard Entertaining and Design

-5-

WEBURBANIST.COM -- Retrofuturistic Urbanism: 6 Cities as they Could Have Become

#upgraded @pandora_radio - Share Email

I love Pandora.  I've been a listener for years.  I'd probably pay for a membership if I weren't scared I'd doom them.  It wasn't too long after I finally subscribed to LAUNCHcast (aka Yahoo! Music) that they closed that offering.

I heard a song the other day that I liked.  Lazy that I am, I just shared it with myself instead of writing it down.  Here's the email I got:

click to enlarge

Yep, that's it. Just some text.  The second line was the text I wrote in.   It could be so much better.

So, unsolicited, I took it upon myself to redesign the email.  Call it free consulting, or just a chance to be creative.

click to enlarge

Features of my revised email:

• Stronger Pandora branding
   
• A chance to connect with the person who sent you the song in the first place (their name is a link to their profile - that also lets you see what Pandora's all about)
   
• A clearer delineation between what came from Pandora's servers and what is user-generated-content -- black text in a white box -- helpful if the "friend" spams you or is in some other way abusive
   
• More content about the song.  Unfortunately, Pandora's licenses prevent On-Demand streaming, so you can't actually listen to the exact song you've clicked in to, but you can create a station of similar music (and eventually hear it) as well as other activities related to the song. This part of the email is a screen-grab from their existing profile for the song (the other option for sharing is a station) and shows you some of the power in Pandora's genome project and gives you additonal song choices)
   
• A more complete footer - information about Pandora to make it more CAN-SPAM compliant as well as additional important options missing from the previous version (the ability to report someone for using Pandora to send spam as well as the ability to block all future sharing if you just really hate music)

To be honest, this is a pretty basic Photoshop edit.  I didn't spend a lot of time thinking about responsive design, but their website and their emails are already designed to look good no matter the screen size, so by leveraging their existing design language for my proposed redesign, it probably would work without too much trouble.  (It's definitely wider than I would do if I were building it from scratch.)

(I was inspired by the person who redesigned the Twitter emails a few years ago - Twitter adopted their designs or took note of their suggestions.  Sadly, I can't find the post now.)

Feed Sift (06/19/2015)

-1-

LIFEHACKER.COM -- Prepare for Networking Events by Writing Follow-Up Emails Beforehand

-2-

CHANGE.ORG -- Crayola: Stop Telling Kids to "Color Their Mouth" with Fake Dyed Candies

-3-

HOUZZ.COM -- 5 Ways to Get a More Beautiful Concrete Patio

-4-

MORNINGDEVOTION.OASISMEDIASERVICES.COM -- The honorable thing to do

-5-

TWISTEDSIFTER.COM -- Food Gradients - #ocd-squee

Feed Sift (05/15/2015)

-1-

WEBURBANIST.COM -- Touching Art: Raised Prints of Famous Paintings for the Blind

-2-

ENGADGET.COM -- Stanford Scientists Make Leukemia 'Grow Up' and Eat Itself

-3-

LIFEHACKER.COM -- Your favorite imaginary friend returns for a third and final season of Moone Boy!

-4-

LITMUS.COM -- Apple Watch Favors Text Version and Breaks Links - I have to ask... as an email marketer, it seems like a 'why even bother?' Maybe for simple transactional alerts or if we get our own MIME-type, but until then, this is just painful.

-5-

LIFEHACKER.COM -- Learn How to Easily Detect Counterfeit Bills

Feed Sift (05/08/2015)

Ah, Friday. I hope everyone has a great weekend!

-1-

ENGADGET.COM -- Tesla's Model S is getting a self-driving 'autopilot' mode in three months

-2-

BRAMBLITT.MYSHOPIFY.COM -- Sightless Works: The Art of John Bramblitt

-3-

LIFEHACKER.COM -- How to Keep Planning Great Date Nights in a Long-Term Relationship

-4-

TWISTEDSIFTER.COM -- The Ingenious Design of the Aluminum Can

-5-

HOUZZ.COM -- 9 Tricks to Boost Your Home’s Appeal for Less Than $400

The Sift (Aug. 1, 2014)

Happy Friday - here's 5 articles that I thought were cool.

ENGADGET -- A 1,000-foot high wall might be the key to saving the midwest from tornados - Darn it, I knew I should have copyrighted that idea when I had it years ago.

HOUZZ -- How to Add a Backyard Shed for Storage or Living - just so we're clear, internet, I still haven't forgiven you for not telling me about this site sooner

KITEBRICKS -- Kite Bricks - they call it a new way to build, but I was creating buildings and space ships and cars when I was a kid. In fact, wasn't there a movie about this kind of building process earlier this year? (Oh.. wait.. these are full size Legos? Well, then that's completely different.) Either way, this is interesting - very little waste and probably a very fast method of construction. Check out the video.


SETH GODIN -- When in doubt, re-read rule one - hint: rule 1 is the customer is always right. It's a little myopic (he probably doesn't read Not Always Right but it's still a good thought.

BAKER -- Case Study: Wrigley 5 Gum - as a fan of this gum, I thought this was a really cool read - how they took it from ideation to execution, complete with a progression of designs and themes.

The Sift (July 25, 2014)

Happy Friday. As always, five stories that caught my interest.

WEB URBANIST -- Shape-Shifting Furniture: Interactive 3D Surfaces from MIT

LIFEHACKER -- Build a DIY Sliding Door Bookshelf to Hide Your Secret Lair

ENDGADGET -- New York's next big neighborhood is its smartest

WEB URBANIST -- Gritty City: Dark Oils Capture Essence of Bustling Urbanity - neat artwork

HUFFINGTON POST -- 'Calvin And Hobbes' Kid's Bedoom Makes Us Want To Be Little Again (PHOTO, VIDEO)

The Sift (July 4, 2014)

Five things I've read recently that I wanted to share. Happy Independence Day to my American readers.

ENGADGET -- Facebook's company trip to Africa leads to more efficient Android app - this is awesome. I once took a group of my staff and peers to a Starbucks where we imagined how our website would be different if we worked at Starbucks.  As we sat around and drank coffee, it got us out of the office and made us think differently. I wish I had the opportunity to do more of those types of things - imagine what we'd think about if we were answering questions as we walked around Home Depot or Target.

A LIST APART -- Letter to a Junior Designer

NIELSEN NORMAN GROUP -- Define Stronger A/B Test Variations Through UX Research

GOOGLE CHROMIUM -- Web Fundamentals and Web Starter Kit: Resources for Modern Web Development - In retrospect, the questions isn't why Google decided to do this, but why it took them so long?

NIELSEN NORMAN GROUP -- Decision Making in the E-Commerce Shopping Cart: 4 Tips for Supporting Users

Misdirected Design (A Work-Related Post)

Design should convey its message, even if you miss important details. But if you aren't specific, design might be done for design's sake and your message may get lost. For instance, this box, instead of saying "No matter where - Nature Valley is there." instead says "the path - Nature Valley is there." (umm... what path?)

However, that's minor. This is more troubling:

Worth Repeating: Fabian Oefner

Video:


Fabian Oefner: Psychedelic science -- Swiss artist and photographer Fabian Oefner is on a mission to make eye-catching art from everyday science. In this charming talk, he shows off some recent psychedelic images, including photographs of crystals as they interact with soundwaves. And, in a live demo, he shows what really happens when you mix paint with magnetic liquid--or when you set fire to whiskey. More on TED.com...

Why I'm posting: Art plus science equals wow.

Feed Sift

Five things I felt like sharing...

-1-

Two Kinds of Loyalty (Seth Godin)

-2-

Ignorance is not an opinion (Dilbert)

-3-

Book Review: The Elements of Typographical Style

The Elements of Typographical Style by Robert Bringhurst

This was an eye-opening book and I can't think of a person I'd recommend it to. Except maybe Monika S.

Over ten long chapters, Elements basically says that typography is an art and you all are clueless. Not stupid, but unknowing. Without making you feel dumb, Bringhurst delivers what feels like a series of essays on everything from page layout to font choices to all kinds of considerations you would have never ever thought about in a million years. This is the book for someone who knows Comic Sans is evil, but wants to know why.

Ok, so it actually doesn't mention Comic Sans that I can recall, but the wealth of information in this book is really, really cool. The author matter-of-factly covers fonts, languages, history in such a way that you'll never look at that blinking cursor in Word the same way again. Now not only does the blank screen mock you, but so does the filled screen. Are my margins right? Have I calculated the right amount of leading? Are Microsoft's algorithms for kerning respecting the font? Are they good enough? Am I going to have an orphan line?

Hack

I wanted to do something different for a blog post and so I thought maybe I could draw out this idea I've had in my head for some time now.  I sat down to try to sketch it and realized I couldn't get the perspective right. So I tried drawing a few other things and realized that my "ability" to draw hasn't magically improved in many years of not drawing.

So finally Googled a subject I like: floating homes in Seattle and then tried to sketch a rough interpretation.  In real life the one from "Sleepless in Seattle" would be where I drew a dock instead. There are also houses behind and to the right, but I wanted to focus more on the one house than the ful scene. The perspective is still wrong, the photo I was looking at was from water-level and yet mine ends up being from the crow's nest of a tall ship or a helicopter or something. Which makes the trees and Aurora Bridge in the background look weird.  Oh well.  Thanks to my daughter for the use of her colored pencils.

Don't Make Me Think (A Work-Related Post)

So the coffee creamer and sugar at work went upscale. The containers were redesigned with the dark neutrals that are all the rage these days, but at the cost of usability.

It used to be that these containers were primary colors: One was blue and the other was red. A bleary-eyed soul who hadn't yet had their first cup of coffee could quickly reach for the correct one without having to stop and you know, think. Thinking's not any fun before coffee.

The world will go on, but it just seems like one of those silly decisions made without putting enough thought into it.

The title of this post comes from a great book on web interface design that actually argues in order to make a foolproof, brain-dead simple interface that people just intuitively understand without thinking - that requires a lot of thought by those who are designing the interface. The book is many years old now, but it's still so true.

Worth Repeating: Nick Veasey

Video:


Exposing the Invisible: Nick Veasey shows outsized X-ray images that reveal the otherworldly inner workings of familiar objects -- from the geometry of a wildflower to the anatomy of a Boeing 747. Producing these photos is dangerous and painstaking, but the reward is a superpower: looking at what the human eye can't see. More at TED.com...

Why I'm Posting: This is so cool. Takes a lot of work, but some pretty neat images.

Worth Repeating: Beau Lotto

Video:


Optical Illusions Show How We See - Beau Lotto's color games puzzle your vision, but they also spotlight what you can't normally see: how your brain works. This fun, first-hand look at your own versatile sense of sight reveals how evolution tints your perception of what's really out there. (More on TED.com...)

Why I Posted - This is just fun and clever.

Worth Repeating: Tim Brown (@tceb62)

Video:


Designers: Think Big - Tim Brown says the design profession has a bigger role to play than just creating nifty, fashionable little objects. He calls for a shift to local, collaborative, participatory "design thinking" -- starting with the example of 19th-century design thinker Isambard Kingdom Brunel. More on TED.com...

Why I'm posting - Brown illustrates some good examples that you might not even consider design, but cases where big things happened, infrastructure-big. It's hard to imagine things that large being done today and it's no wonder that when we think of design we think of websites or logos or cell phones.

Attention to Detail: Pink (@VSPINK)

Apologies if this is a repeat.  While I am not their demographic, I snapped this with my camera last month because I think it's pretty awesome.  Once a year I spend most of the day in Tukwilla at the mall or surrounding areas - shopping for Christmas presents, walking or jogging, taking a little time to myself.  It's usually early in the first week of December and this year I headed up after dropping the children off at their schools.  So I got to the mall before most shops (save Starbucks) had opened.

So I grabbed my coffee and began to wander.  So where lots of other stores have ugly roll-down or roll-out gates, PINK has something far different - a series of wood and glass panels.  The wood is distressed and varied in color/finish, the glass ranging from clear to frosted to stained glass.  Most people will never see this and it probably cost more than a standard metal bar gate but it's a really nice touch. I think this speaks to me in terms of beauty and richness.

in your face

Our department does all things digital for the organization... website, email, social, advertising, SEO, you name it. We're situated right next to another group that handles mostly print. One might ask why we're siloed by medium, but that's another topic for another day on someone else's blog.

(click to enlarge)

There are three ways to access our department. One of them involves going past a wall of signs extolling the virtues of print. I find it insulting but I'm told (by someone on our team who we hired away from that team) that its placement makes sense considering who sits on the other side of the wall. I don't know what that means, but whatever.

I really want to add two of my own:

"Print is permament."

and

"Print is hack-proof."

(And then scribbled across it "if you don't have a Sharpie.")

I feel like I'm almost creative enough to do them in such a way that they could stay up for days or weeks without people noticing but I feel like that would ultimately annoy the wrong people who might make things unpleasant for me by way of a meeting with my boss where he tells me to knock it off.

I'd probably have better luck making signs for the Home Depot sheds like "Not intended for use as a residence" or "Guaranteed Ghost-Free for Three Years"