Leave a comment

Yahoo! Weather Gets One Step Ahead by Working with Apple

It has been a month since I chose Yahoo! Weather app as my default weather app on my iPhone. I liked the UI style of the app, simple, information matter on the front and center and the pretty Flickr local scenery photos, all with good touch. After WWDC 2013, it turns out that this app fits right into the new iOS design. Is Yahoo!’s designers THAT good? Or they can see into the future?

The question became very obvious right after I delve myself into Apple’s ‘out-of-the-oven’ Mobile Human Interface Guideline (can be found here, need to have developer account to access):

Yahoo-Weather-before-afterr

Since iOS default weather app actually use Yahoo weather, I think designers in both companies must have talked before releasing their version of the weather app. Good for Yahoo! I’d say. And maybe in the future if we want to get a sneak peek into iOS changes, we could pay a bit more attention to Yahoo’s weather app?

 

4 Comments

What Exactly Apple Did with iOS 7?

icon-ios7

So the biggest announcement in tech industry is behind us. Yesterday in Apple’s WWDC 2013, the new iOS 7 was released to the public. My feeling towards it is a mixed bag. I liked the simplicity of the new design language, but not a big fan of the somewhat ‘childish’ app icon colors. I’m excited about the huge potential of iOS for cars (which deserve another blog), but not so keen on the Control Center. When all the excitement and disappointment quiet down, I tried to put all the pieces together and wonder what exactly Apple did on iOS 7?

Here is what I found out:

1. Stronger Design Rules

  •  Grid system:  As Jonny Ive put it ‘Developing a grid system allowed us to achieve a much more harmonious relationship between individual elements‘. A well designed and implemented grid system will hugely improve the inner relationship between scatter around UI elements, thus making them feel like part of a single piece. This is essential in ‘flat design’ that iOS is obviously influenced by.  Not that iOS 6 is designed without a grid system, it’s just that the previous ‘skeumorphism’ UI style give ample affordance and visual clue, thus a grid system’s importance is not as critical as a simplicity centered flat design.

ios7_grid_system

 

  • Redesigned color palette:  Anyone familiar the old iOS will find the new one way more colorful, to the extent of making some uncomfortable. These colors come from a re-designed palette that go well together. This actually reminds me of when iMac is first introduced to the market. The beautiful neon colors really capture a lot of attention. Some would say the new look of iOS is actually childish and will hurt its image of a professional device. I tend to disagree. There is nothing wrong about being colorful, being bold as long as it’s still well thought out and designed to please human eyes. iOS color has been dull for soooo long, and it’s time for a change.

ios-7-palette

 

  • Dynamic UI that get out-of-the-way when not needed:   Nothing can be said better than Apple’s own terms, and forgive my laziness of directly quoting them here: ‘The interface is purposely unobtrusive. Conspicuous ornamentation has been stripped away. Unnecessary bars and buttons have been removed. And in taking away design elements that don’t add value, suddenly there’s greater focus on what matters most: your content.‘ Also a ‘flat’ UI make doing this easier, since all the elements are mostly colorful geometric shapes, it won’t hurt the snappiness of the UI as badly as a ‘unwieldy’ heavy textured UI.

2. Industrial Design and UI Design Integration

This has been criticized all along. People complained about the minimalist industrial design of iPhone doesn’t match the ‘skeumorphism’ style UI. Now it seems with the iOS 7, they are start to come to the same direction: Simplicity. One good example is the layered effect iOS 7 trying to create with the use of translucency. It might look very subtle, but it means a lot. It makes your iPhone felt more legit and physical, more ‘real’. In heart, the new iOS 7 is still trying to be ‘real’, but it has evolved from ‘visual skeumorphism’ to ‘psychology skeumorphism’. After all, Apple is all about making technology human. Or put it in their own words:

“Technology should never get in the way of humanity”

ios7layer

3. More Mobile Friendly

  • Conserving Power: A big development iOS 7 bring to the table is to conserve power usage when the app is not in the foreground. No other company came close to how deep Apple dig to save the 1 minute of battery power.
  • Flat Design uses less CPU power, thus smoother: I bet the new iOS 7′s built-in UI image resource size is much smaller than iOS 6. To put it in layman’s terms: It has become leaner and faster. Exactly what mobile demands.

4. Character?

This is a vague feeling of mine. I can’t really put my finger to it. But the bold color, the subtle translucent layers, the smart UI that will hide themselves when I need to view my content, the smarter and more human-sounding Siri, etc. all give me a feeling that iOS 7 somehow come to life, has its own character, and evolved to be smarter and prettier. There’s a slice of humanity in it, no matter how thin it is. Maybe it’s just me day dreaming, or maybe this is also Apple’s vision?

BTW, the Apple official iOS 7 Design page is by itself a design lesson, I recommend going through it. It’s not just a sales pitch.

 

2 Comments

UICraft: Yahoo’s Search Page UI Evolution

For people who take note, Yahoo! has been undergone many changes on their culture, products and more subtle things. Like the recent updated search page UI, which is claimed by Yahoo! to “puts your results front and center.” If you are a designer like me, these words will appear in your mind when you think of Yahoo!’s past search page design: ‘obsoleted, busy and full of clutter’. That’s why people have some love to themselves usually don’t want to visit Yahoo!, it makes their eyes ‘bleeding’. It makes mine do at least. But, the recent changes on the search page UI did breathe some fresh air into it. Let’s have a closer look:

yahoo-search-beforeyahoo-search-after    Image via : The Verge

The change is quite observable, and on the right direction. Overall the layout is cleaner, the information are better organized and navigation is easier. It feels to me that the rather strict discipline mostly found in mobile app are applied here. The designers in Yahoo! are using space as if it’s as scarce as in mobile device, even when they are designing a full webpage. This leads to a ‘mobile app’ grade experience and consistency across all platforms.

I totally understand if you stopped here, but if you are interested in what exactly get improved on the UI design of Yahoo! search page, I’ll explain in more details:

1. Change of search results font color

This might not seem to be a big deal, but it’s a huge relief to the eyes. The old page use pure blue, which is also the default color of URL link on web. When the Internet is born, having a different color to separate URL link with plain text is functional, but many years has past and people demand much more. The default blue color provides too much contrast and not very comfortable to the eyes. Also using default blue will make it easy for people to relate to those ‘crude’ and poor designed website, doesn’t really what Yahoo! want its viewer to relate to.  A subtle change to a lighter blue on the new design make things much better.

2. Stronger Application of Grid System

As can be seen from the old design, the alignment is lackluster, especially on the center search results part. The only strong alignment you can find is that all the text are left aligned. Whereas on the new design, we observed that now all the search results are placed in a fixed width container. The search bar on top of the page also shares the same width with the container, creating very strong alignment. The page now are very clearly divided into three columns. Left column is all the different search types user can choose from, middle column is the content (search results, as Yahoo! claimed, front and center), right column is ads area, slightly out-of-the-way (where ads should be). The strong alignment and layout make it much easier for user to find their way around.

yahoo-search-grid

 

Three Columns

 

3. Less User Interface, More Content

It has become more of a trend in nowadays web design that user interface gets out-of-the-way and make the content front and center. This is the direction Yahoo!’s new search page design is heading. A very observable part on the old page is the ‘search types’ tabs on top of the search results, it has now been moved over to the left column, leaving only the search results in occupying the entire center column.

yahoo-search-types

Search Types Tabs are removed on new design

These changes aren’t rocket science, but it shows that Yahoo! starts to care about user experience. It might be a very small step, but it is welcomed nonetheless.

4 Comments

Xbox One: From Hardcore to Family Friendly and Why Gamers Complain

Xbox One: From Hardcore to Family Friendly and Why Gamers Complain

New XBOX ONE

I call myself a gamer usually. Though I don’t always have the time to actually sit down and turn up my Xbox 360. I played games enough and are still in the community to understand what’s in gamer’s mind. I’ve been trying to put my fingers on the new Xbox One release and why gamers, especially hardcore gamers, hate it. I think I can relate.

Some say they don’t understand where gamer’s rage come from. After all pricing stays the same and the product become better. But pricing always stays around the same or even less for newer products, or no one will buy them unless something unique justify the price increase. That’s people’s expectation now. The thing people complaining, especially the more hardcore gamer bunch, is the direction Xbox One is going. It’s going from a dedicated hard-core gaming console (by dedicating I mean dedicate on hardware, OS, integration, feature sets, etc.) to a generic ‘a-little-bit-of-everything’ set-top-box. I think gamers felt a bit like getting ‘cheated’. You have to understand those hardcore gamers, they take it very very seriously. When you are playing COD and you’re about to die if not jumping off a platform to avoid the incoming bullets, that one second delay because of Netflix or other features will be the difference between living and dying for them.

Yes there are casual gamers, but they don’t really care about Xbox or Playstation or Wii, hell they are happy enough with a Galaxy or iPhone even. (Which is totally fine, I’m a casual gamer now myself and liking it.)

I think gamers are upset because Microsoft uses its influence and success on Xbox which is popped up by gamers to pursue its other agendas and leaving gamers behind (or marginalized at least). And as we know it, more often than not, Microsoft’s new agenda won’t be welcomed with great success for some time now… So this feels like a ‘omen’ to gamers.

Will the shift on Xbox One get them more sales because of the shift to broader audiences? Maybe. But at what cost? The exodus of most of their core gamers customers?

I really don’t know whether this is a good thing for them or not.

2 Comments

UICraft: Why Facebook’s New ‘Stickers’ is Stupid Yet ‘Sticky’

Following Path’s step, Facebook recently introduced a sticker feature in their messaging experience. Stickers are a glorified version of ‘emojis’ which user can send to their friend while chatting to express emotions. It usually comes with a package of different expressions/emotions. All Facebook’s current stickers are free to download, but the ‘Free’ tag could very quickly become ‘$0.99′ like most Path stickers do.

Facebook-Messenger-stickers

 

Image via: phandroid.com

Stickers are no new creation by Facebook at all. A bunch of Asian messaging apps and services have already embraced it for some time. This whole ‘cuteness’ thing might seem silly, yet before you shout ‘stupid and cheesy!’, let’s not forget all the ‘stupid’ videos that got millions visits on YouTube. There is something behind all these ‘stupid yet popular’ fads. Most of them share one treats: They play very well to your emotion. And emotion, my friend, is usually our weakness. That is what’s behind all these impulse purchasing, all these ‘my brain tries to say no but my body screams YES’ moments, all those ‘this is so stupid but I just can’t stop laughing’ videos.

This is also why some  apps are successful in creating attractive experience. Enter ‘Clear‘, the highly successful to-do app with flat and simple visual but powerful physics and interactions. By swiping the item right, user can mark complete the task. Swiping left is delete the task, pinch open to add an item and pinch close to fold the current task list. It might sound simple, yet it’s physics is so great that when you are doing all these simple operations, you feel like you are manipulate a real object, you are throwing the completed task away like throwing your empty can of Coke to the dump. It relates to your feelings and emotions.

I still remember when the first time Apple released iPhone and introduced multi-touch, people are instantly amazed by the interactions without rationally knows why. Like Steve Jobs once put it in his keynote when demonstrating a multi-touch feature :” I can play this all day!’. As human-beings, we are sophisticated, we use our brains, we developed science. But most of the times, we aren’t that smarter when it comes to our emotion. We fall in love, get hurt, heal through it, and do it again. That just how emotion works. It is sticky and always comes back. No wonder after Path first announced their Stickers and In-app shop, they said the first week it brings in more money than all the money the company has ever earned before. No wonder Facebook is following suit.

Leave a comment

People Are Walking Away from Theaters and It’s OK

theatre-seats

Image Source: mamadrama.com

Less and less people go to theaters nowadays. Ticket price is hiking so do the gas price. More ‘long tail’ contents like PSY’s ‘Gungnam Style’ are pulling people’s attention here and there. What I observed is a role shift of the theater from ‘main-stream-cheap-no-brainer’ choice of weekend entertainment to upscale-expensive-optimized-experience once several months. Why? Because cheaper substitutes emerge, with Netflix, Hulu, etc. on the service side and smartphone, tablet, smart TV, LTE on the hardware side. And content is shifting from a mass market dominating ‘hit economy’ to a more commoditized ‘long tail economy’, leading by the prevalence of Youtube, Vimeo, and thousands of user created contents.

Old business case needs  retooling and new models need to be invented.

Forgive me if I’m being too dramatic on this, but like Charles Dickens put it:

‘It was the best of times, it was the worst of times’.

2 Comments

Long Time Coming : Netflix dump Microsoft’s Silverlight for HTML5

Due to Microsoft Silverlight’s lack of support in the future, Netflix is moving their platform to HTML5.

Stick to an out-dated, poorly supported and proprietary plug-in isn’t the way to gain edge on competition.  Netflix has been making great progress on creating its own exclusive contents like House of Cards. They are right on their way to the goal of ‘becoming HBO sooner than HBO become us.’ This move away from Silverlight to the more mobile-friendly HTML5 shows that they haven’t forgotten their technical origin during the transition. 

I look forward to any UI/UX innovation they would bring to us with the introduction of HTML5. 

Follow

Get every new post delivered to your Inbox.

Join 133 other followers

%d bloggers like this: