Mobile Experience Blog


Full disclosure: muvee is a client of ours for whom we recently completed an Android mobile design project. muvee makes video creation fun, simple and easy to share with underlying algorithms. The muvee video editor lets you select video and still pictures, add a soundtrack and pick a presentation style. Add graphic elements with templates then push a button. You instantly have a personalized video that you can immediately share with family and friends.

Design For Muvee

I tend to be a fan of anything that enhances creativity and inspires sharing – which was our main goal in designing their mobile user interface. Some very useful features include automatic face and motion detection, different style choices, and syncing photos or videos to the beat of the music the user chooses. For example, you can choose a high-energy theme that would effect the pace, presentation and style of your creation.

The muvee video editor is a pretty compelling case for OEMs as well as carriers. Today’s consumers shoot tons of video but what do they do with them? The underlying algorithms take most of the work and thinking out of the creative process, making this a greatly useful tool for designing a mobile experience. Rather than spending hours attempting to create a professional video, creating and sharing can be accomplished within minutes. In this way, consumers will be more likely to create and share more often, especially on the go. Also, due to their patented algorithms muvee has a natural edge in the industry.

muvee will present this Android project at Barcelona Mobile World Congress the week of February 15th. Visit muvee at Mobile World Congress in Hall #1, Booth 1F06 to check out their cool product and see the Android prototype we designed for them.




Mobile user interface designs need to be user and client friendly. The best way to keep this a top priority is to be able to easily present and adjust the design throughout the creation process. One difficult hurdle is not having access to a devise or designing for hardware that isn’t complete. When we’re working on a new mobile user interface design without access to hardware, there are a few things that make the process run smoothly and ensure our success. One key step is printing variations of what we’re doing on photo paper. 

Design Tip Photo Paper

We print out designs on glossy photo paper to mimic the look of the screen and to see our design with pixel-level detail. Spending time on the details in the beginning of a job is paramount in designing a successful mobile user interface.

Viewing an image of a mobile device on a computer screen doesn’t give an accurate representation of the finished mobile user interface design. The pixel density (pixels per inch) are much higher on a mobile device. When we don’t have access to hardware, our solution is to design the mobile user interface at real size in terms of pixels on a computer and then scale it down and print on photo paper at the real size the screen will be on the hardware. This gives us the real size that an image will be on a mobile device.

Using this method we can see if the layout and fonts work. It’s critical to determine if the user interface will be functional with big enough fonts and clear user interface elements.

This is also very handy when we’re designing for touchscreen mobile user interfaces as spacing is another issue that is distorted on a large computer monitor but solved by printing out. We can test to see if any user interface elements overlap and see if we need to adjust them for the mobile device.

Printing out our design also makes it possible to present our mobile user interface concepts to our client to give them a more accurate feel for the design. It also helps them in their presentations (remember the missing hardware…) We’ve seen our photos used in the past presented on plastic model prototypes. It was cool to see as people would dissect the interface and analyze it as if it was digital.

I’d love to hear any other User Interface Design challenges you face and you solve the problem.




A FastCompany post announced that HarperCollins has launched www.inkpop.com –an “interactive writing platform for teens.” Inkpop allows members to post books, short stories, essays, and poetry for review and critique by the community.

Interactive Teen Writing

The website copy claims that inkpop.com will connect “rising stars in teen lit with talent-spotting readers and publishing professionals.” And that “members play a critical role in deciding who will land a publishing contract with HarperCollins.”

Pretty brilliant on the part of HarperCollins – they enlist the help of a narrowly targeted community to vet aspiring writers. My guess is that a teen who totally into literature these days might feel slightly isolated. So I’m happy to see a social networking site bringing kids together that promotes reading and writing.

This is perfect for mobile. Teens today can’t imagine a world without their mobile device and if this catches on, mobile apps to enhance the site will probably happen quickly.

HarperCollins is also benefiting from the ability to grab key demographics and has a perfect forum for targetted advertising. If the inkpop model catches on, I image it will move beyond a teen-only site. After all, it’s just teens that are reading a certain off-the-charts popular vampire series, right? And those books weren’t written by a teen but by a stay-at-home mother of three.

It will be interesting to see how other companies create interactive forums and social networks that enable their future suppliers as well as consumers.




Brian Duffy filed a great report for CNN about a bulletproof tailor in Bogotá. The tailor combines high fashion with body armor. Duffy ended up getting shot in the gut while wearing one of the garments – it worked. What does Colombian tailor Miguel Caballero have to do with mobile design and user experiences? Caballero knows his target audience, he knows what works and he delivers a quality product. Here are some quotes from Miguel Caballero and lessons that can inspire mobile user experience design.

Miguel says “We have to study what the aim of the user of this type of clothing to design the better option to these people.” Sometimes stakeholders in projects have difficulty in distinguishing what they want in an app versus what a user wants. A user-centered approach is frequently the key to the success (and profitability) of an application. Do you constantly put the user in the forefront when designing for mobile?

How will your app be used in a variety of situations? Our bulletproof tailor does. Caballero looks at how the garment will be used – internally, externally, in a hot climate and a cold climate. What’s the context of how the user will be using your app. Walking? Driving? In a loud restaurant? In a quiet location. In a bright park? In a dark theater? In emergencies? In the car or at the office? Think about every possible situation and consider every option. Do you think about multiple contexts when designing for mobile?

Miguel involves everyone in his product testing. He requires all employees to wear the clothing and then he shoots them. Are you utilizing feedback from all your stakeholders for mobile design?

Shooting his employees is the way Miguel exercises “quality control”. It’s a great idea to involve everyone in your process. I’m a big fan of kaizen from a design as well as business standpoint. Are you always trying to improve your mobile design projects?

Being on top of social and lifestyle trends is critical when designing mobile user experiences. Miguel has plans to expand and market to the hip-hop community. Are you leveraging social trends when designing your mobile user experiences?

So take a lesson from a Columbian tailor – know your audience, design for them, involve everyone in testing, keep up on trends, and think outside the box.




InteractiveTV Today announced that Immersive Media is making available 360-degree, interactive, online video footage of Haiti to agencies, government departments and news organizations involved in the relief efforts, free of charge.

Immersive 360 Video

Welcome to the next generation of street viewing. I’m sure the live video is amazingly helpful in the Haiti situation but I can’t help thinking about how much it opens up mobile design possibilities.

Real estate, the arts and education are just a few of the industries that will be enhanced by 360-degree video. Save time, save money and avoid hassle – I can’t see a downside and I can’t wait to see what is next for live video.

I’m fascinated with the way many emerging technologies are so compatible. Combine Augmented Reality and live 360 video for amazing immersive mobile user interfaces.

Consumers will love it but advertisers are going to flip over the insane amount of organic advertising and promotion possibilities that will open up. See my post about Google Street View, specifically how targeted ads can be displayed to consumers at almost the exact moment of purchase and offer discounts, special offers and additional information. Extreme interactivity will be the key to opening up and unlocking even more creative mobile design possibilities.




When designing mobile user interfaces, we always face the design challenge of pixel density on a mobile device. What you see on a computer screen is usually larger than what you will see on a mobile device and sometimes we don’t have access to the target device we are designing for.

Mobile UI Design Tip Pixel Density

There are a few ways to address this and make sure that a mobile user interface design is appropriate when smaller. One solution is simply shrink it down to the exact size of the mobile device we are targeting. This is fine to determine if the general layout works. However, it doesn’t work well with fonts as the text can get distorted and then you can’t determine whether you’ve chosen a good font size.

Many graphics applications (Photoshop, Flash and Illustrator to name a few) allow simultaneous views of the same visual document. This is an extremely helpful tool when designing mobile user interfaces.

In the above screenshot, two views of the same document are shown. The one on the left is at 100% and the one on the right has been reduced to match the exact size of the mobile device screen we’re targeting for this user interface. We can make any changes to the image on the left and manipulate the view in any way we want while keeping the right view open to see how our user interface will look on our target mobile device. To do this in Photoshop, with a document open, select WINDOW>ARRANGE>NEW WINDOW FOR…

Another way we use dual screenshots is to make sure the user interface controls for a touch screen UI are spaced correctly. We simply touch the design that has been sized on the monitor to match the mobile device to determine if the user interface elements are far enough apart.

The Mac has a tool we like called Screen Shrink that allows us to literally shrink a screen so we can see what part of it may look like on a mobile device. This also works well when you see an inspiring design on the web and wonder if it could work well at a smaller size.




Fierce Mobile Content reported that Amazon will be inviting software developers to build “active content” for the Kindle Store later this year. Although the “a” word wasn’t mentioned, it’s clear that Amazon is getting into the app game for their eReader.Kindle Mobile Media Consumption

It’s a great idea to leverage a developer community. An Advertising Age article has a good analysis on Kindle moving into apps. Some opinions seem short sighted though. For example, while people complain about the greyscale experience, it’s likely that Kindle will get a color display.

A separate Fierce Mobile article reports that Kindle services will represent 10 percent of Amazon.com’s total North American sales in five years. In addition to books, Amazon sells VHS, DVD, CDs, MP3s, computer software, video games, electronics, apparel, furniture, food, toys and so on and so on. What if a future version of Kindle supported all of these products? Talk about a ridiculous about of synergy.

With a Kindle and Amazon.com’s product lines, the possibilities are endless. What if you were reading on a Kindle and the main character is enjoying a tasty pizza? Suddenly, you’re presented an ad to order pizza. And if that had had a coupon? Even better. See my post about advertising on the Kindle.

Another possibility for eReader enhancement brings to mind Mad Libs – fill in the blank and create a story. The Ad Age post quotes Richard Schatzberger, director of creative technology at Bartle Bogle Hegarty, New York. He talks of “living books” where an author could program a story to tailor itself to the reader — a book that reflects the current weather, or is set in a reader’s city.

It will be interesting to see if apps catch fire for the Kindle or future versions of eReaders. But one thing is sure – combine classic “book” consumption with technology and get ready for spirited debates.




A recent study sited on textually.org revealed that more than half of consumers in 11 countries used their mobile phones while shopping in a store. Uses included comparison shopping, getting peer feedback, looking up product information and finding coupons.

Mobile Shopping

I recently did exactly that. I was browsing a bookstore and picked up an interesting title. After looking up a great review on Amazon, I made the in-store purchase. Then I added other books to my Amazon cart to look up later.

This should bring a sigh of relief to traditional retailers as well as a call to action. Retailers need to explore how the physical in-store experience can be complemented and enhanced by mobile.

One great way to blend shopping and mobile is with visual searching. The Nokia Point & Find is a good example of how this could work. Forget about waiting around for a sales clerk. And what are the chances that a retail employee is knowledgeable about every single item in a store? It would be great to just snap a picture of an item or hold your device up to it and get instant information.

Large retailers could really benefit if they had their own app. For example, if you were at Best Buy, the app would provide information on the in-store product as well as suggesting additional purchases (a power cord, batteries, etc.), giving details of the warrantee program or outlining a special credit card offer.

The opportunity to access exclusive offers, coupons and discounts in-store with a mobile device would be great. Also, retailers should make spreading the word to your social network or an individual contact as easy as possible.

The next time you head out to shop, remember that your mobile is a great companion.




Just when you thought Google Street View couldn’t get more personal (Remember the UK controversy when Google captured images of men barfing on a sidewalk, emerging from a porn shop and getting arrested?) Fast Company reports that the search giant wants to populate billboards and ad-spaces in Street View with real-time ads.

Street View Virtual Ads

For example, instead of showing a months-old photo of an advertisement for an out-of-date movie, the studio could pay Google to constantly update the virtual billboard with an image of their latest release. Cool, huh? 

Google describes Street View as “the last zoom layer on the map - when you’ve zoomed all the way in you find yourself virtually standing on the street. But the most exciting thing about Street View is all the amazing uses that our users and partners find for it.” Could real time advertising make the feature even more useful? I think so. 

Of course all virtual billboards would link for more information opening up a host of possibilities. The link could lead to highly targeted advertisement based on user profiles. A mom would see a mini van billboard, a mid-life crisis aged male would see a sports car promo. A “mood-based” feature would also be a possibility. Users could select what type of trip they are taking. A business trip would show coffee shops, an entertainment adventure could show mini golf or movie theaters. Key in “hungry” and restaurant advertisements appear. 

Last minute discounts would be another great feature. Perhaps you’re driving by a sold-out theater – an open discounted seat offer could pop up. Additionally, consumers love feedback. Augmented Reality could be used to link reviews and merchants to an ad. 

One industry concern is the issue of who actually owns virtual space in a media buy. If one company consistently buys the same billboard on a busy street, could their competitor acquire the virtual space and overlay in the street view? It will be interesting to watch this play out.




Mood rings were popular in the 1970s. Mobile devices may be the modern day mood ring. Fast Company posted a story about new emotion-detecting software launched at TechCrunch50. Affective Interfaces claims that it has developed an ultra-accurate system that can detect emotions correctly over 85% of the time.

Emotional Mobile User Interface Design

The Affective Interfaces website welcome message reads: “Knowing what your customers are doing is great, but wouldn’t you like to know why?” Harvesting information from consumers is a great use of the program. Focus groups these days cover everything from new product perception to jury trial preparation and they are labor intensive to arrange and costly to run. Fast Company notes that Affective Interfaces could potentially remove human monitors from the equation, saving a ton of money. Additionally, hundreds of users could be part of a group eliminating the need for companies to conduct expensive testing on small numbers.

Taking this a step further, it would be amazing if advertisements could be presented at an opportune emotional moment based on a user’s personality and demographic profile. For example, at the end of the day, a tired mom might see a vacation commercial or a mattress sale announcement. The same mom on a treadmill in the morning might see a commercial for a sports drink or athletic shoes.

Intelligent interfaces on a consumer device could detect frustration on a user’s face and adjust themselves accordingly. A frustrated user would could get more of a stripped down simple user interface and then get more options later as frustrations went away. This could be a great benefit for new users or those that aren’t technologically savvy.

Additionally, the entertainment industry could tweak content choices based on your current emotional state. Music, movies, games and applications could be matched to a particular mood.

What about using emotion detection to monitor a loved one turning it into a potentially an important relationship tool. Let’s say you have the ability to check the emotions of your spouse before you leave the office. Confrontational or angry? Stay at work longer or hit happy hour before you pull into the driveway.