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.

Advertisements

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. 

Samsung’s Recent Copy of Apple and Their Secret Ingredient For Success

Photo Feb 26, 5 49 21 PM

Another blatant copy from Samsung. They could have come up with millions of different designs for the app, but no, they ‘happened’ to come very close to Apple. Makes you think they have Apple designers working for them maybe?

passbook walletImage Source:  The Verge

Hey come to think of it, I think I cracked Samsung’s secret ingredient for success. They took a page from Google on the Android OS, riding on Google’s huge R&D Android department. Then they took a page from Apple’s industrial design, exploiting the best design talents at Apple. Then they copied both Google and Apple’s ideas on application and services, like Passbook, Siri, etc., getting the best of both worlds. See my point here? No wonder they are so successful, they pretty much copied from the best on every area and put them together under ‘Galaxy’ brand. They are the best ‘other’s innovation integrator‘ on the market.

A note to Apple and Google, stop Samsung from doing it or your designers and engineers are also Samsung’s. Another note to legal system, stop Samsung or US companies will suffer even more, or got their success stolen from Samsung. If innovation and ideas cannot be protected here, then what else are we gonna compete with the likes of Samsung? Cheap labor?

Microsoft: To be or not to be

Microsoft: To be or not to be

The prior success of Microsoft Office relies heavily on the dominance of Windows operating system on desktop, and also on the dominance of desktop as THE platform for people to create and consume content. 

Those days are long gone. 

Now everything (read all the money) is going mobile and this is time to reshuffle the deck, everything company should have their mobile strategy in place and start executing, in order to get ahead of the game. Microsoft is lagging behind on vision due to their heavy legacy, and further slow on executing due to bureaucracy. Windows OS and Office are their bread and butter two money makers, they can’t afford to lose them. Windows 8 already shown sign of struggle because of the mixed user interface, now if Office also starts to slow down, I don’t know what they still have?

Xbox?

Business encounter

When building a business relationship in the first place, whether it would be a long term one or not matters much. If both parties consider the biz relationship a valued one and tend to develop it into a long-term mutual beneficial strategic partnership, usually business would be easy to negotiate and errors in execution of project more tolerable, so the error margin in contract negotiating larger. For long-term good, people would usually look longer and come up with more beneficial agreement for mutual good, rather then just ‘milk each other’ as best as possible.
On the contrary, when people pay no attention to long-term relationship to begin with, usually they’ll tend to yield every penny from each other whenever possible, taking every advantage they could find on contract, and getting very picky and strict when an error occurs.
That being said, there is no value or moral judgment on both attitude, but the information above will help us evaluate and counter different biz relationships. For customer really interested and find it worth giving a long term investment, they will tend to compromise on minor terms of contract, tolerate more mistakes. This is kind of bargain power we have, and should be use wisely rather than abuse it. If we have the same thing in mind, we’ll make it a flexibility that we could make use of it for more add-value, like push through some weakness, make them take some risks with us that usually won’t be allow for normal operation etc, and at the same time, deliver and treat them with fair attitude and give them what they want most. For those just treat us like a ‘cash cow’ and wanna milk us as much as possible, that doesn’t necessarily means you can’t make deal with them , just to pay more attention to the detailed terms of contract and make it very clear what you bought and what you’ll get from the deal, and preventing any future arguments from happening.
Customer’s true attitude and intension of biz relationship if of essence, from the first place biz relationship begin , we should begin to observe, analyze and make judgment, and regulate our negotiating/manipulating strategy of the project accordingly.