My views on Google Strategy

Following Steve Fraktor article on article on Google strategy  I decided to dust out an drafted version of my vision of Google strategy I wrote following Google I/O 2013. Steve Faktor ask if Google will eat your business next? He is addressing this questions to start up or other innovative companies. While Google will steps on other people grass for sure, I was more impressed by the Google ability to provide an unified experience across channels and how Google might just become our next personal assistant.

Toward a unified experience

I am amazed by the work done by Google to offer a unique and comprehensive experience across its products. Google+ is becoming more a central identity management framework than a social network. Google+ is now the central repository for all your data and its where Google build your profile. For example any +1 from your network are now available through the maps or search interface. Thanks to the sign in with Google+ functionality, each Google products speaks to each other and data collected on one side is leveraged somewhere else providing an unified experience to the user and a deep profiling for Google ads program.

Each products on its own might not the best in its category (Google+ as social network, Google picture vs flikr …) but the overall experience beats most other services out there and as Steve Faktor points out, each products help to Google to get better data on you and thus better profile its ads. They also help Google to defend Internet usage time against competitors by making you staying longer on Google page rather going on Facebook.

Will Google become your next personal assistant?

Google is working hard to make the human / machine dialogue flow more naturaly. Earlier this year Google start to leverage data and technology of Metaweb and Freebase (acquire in 2010) through the Knowledge Graph.  Now combine this with the release of Google Now to help you to manage your agenda, basic search and reminders and Google Voice  functionality (to search, translate or write email) and you have a powerful assistant in your pocket.

The need for a back office or skills to do those basic factual searches in behalf of manager, CEO or other people will decrease, since Google is doing for you and for free. Once you taste it will be hard to live without it and you will keep feeding Google algorithms with more personal data for their ads engine …. as Steve Faktor wrote:

Every Google service is a tantalizing and addictive mix of free (or cheap) utilities that make our lives easier or more productive. […] Google accomplishes all this through a combination of organic products, non-stop upgrades, and acquisitions. Each one must create deep roots (email, contacts, smartphone) and painful switching costs (did anyone survive Apple Maps?).
The intended effect of all Google services is a lot like a casino. Google wants to envelop you in its world until you can’t find the exits. Once inside, you’ll tell the dealer your life story as he takes your money…

Google I/O – Design Sessions

I had the chance to attend two interesting and complementary sessions on design during the Google I/O 13 conference. During the Get Unstuck: Gamestorming Not Brainstormingsession the audience had a chance to play two brainstorming game. I will not go into detailed descroption of those games, for those curious or interested I recommend the session cheat sheet and gogamestorm.com.

However one interesting statement has been made at the beginning of the session:

Design is following the same path as quality within IT product development team.

It is now part of everyone job, and not only the responsibility of a group of specialist,

and should be in taken into account in every stage of the product development. 

The Cognitive Science and Design session has been very intense in terms of information delivery. Tons of excellent advice  No break through tricks or process have been presented during this session, only a solid list of things to keep in mind while designing your next screen.

Alex Faaborg and reminds the audience about the risk of design blindness, as

  • you are not right person or team to judge your design, and
  • once you launched something it is really hard to go back or do radical changes on it, since
  • a user make up his first opinion (trust, reliability, purchase) on a product based on its design, and it take times to change his mind for an other product / solution – first appearance / interaction has to be solid.
Then the session break down under four mains topics:

1. Gestalt laws of grouping:

  • to get a cleaner interface use white space to group your element instead of hard bar or delimiters
  • if you cannot use white space, vary shapes to group items (using icones or colors background)
  • user will complete half drown boxes and shape (law of closure), no need to over charge your design with closed box, you can just suggest them

2. User’s vision:

  • easier to catch the user attention with things happening in the periphery of the screen than in the center of it.
  • we recognize silhouette faster than the real object (good to keep in mind for icon design) as user don’t have to break down the structure and recognize.
  • among a large number of information, we recognized known faces quickly (use avatar in interface) – on your Facebook timeline your recognizable your friend face and you don’t read their name.

3. Color usage:

  • pay attention to color meaning in different culturs
  • user filter color based information faster than text based.
4. User memory and attention span
  • be careful when you interrupt users in their tasks as it trash their working memory and you will get them out of the flow (and drop a registration or check out process for example)
  • split your task in small chuck to limit the usage of memory and increase the process speed (for example split credit card information in 4 digits group)
  • don’t hesitate to innovate new interface and teach your user how to use it instead or repeating the same interface or process over and over.

Google I/O – Responsive Design

This post will cover the two sessions I attended on responsive design and HTML5 / CSS3 features for cross platform development.

The Point, Click, Tap, Touch session presented touchevent events (touchstart, touchmove, touchend, touchcancel) for tactile devices and how they differ with mouse events when selecting or dragging an element. The touchevent API is supported by all major browsers. Google released a mobile emulation tools for developers to emulate touchevent, viewport and other mobile device specific functionality.

For cross device development the main recommendations was to

  1. Design bigger targets and button to take into account touch screen device (phone, tablet and now touch screen laptop)  or to enlarge your button when you detect a touch event on the page.
  2. Stop using hover events as on a touch screen device a single tap both activate the hover event and the link event in the same time, the link event “over riding” the hover one.

Coming back from the conference and testing the pixel chromebook (a touch screen laptop) on Netflix has been a great experience on what NOT to do. On Netflix when you hover over the cover of a movie a short synopsis and link to related items are displayed, while a click will start the movie. Not being able to see description of the item totally killed my user experience and forced me to get back to my mouse.

An other consideration to keep in mind with the new touch screen laptop is to not disable the mouse if a touch is detected (I’m glad Netflix haven’t done that!) and have your page to listen to both mouse and touch event. You can use event.preventdefault() to manage exceptions.

The second the session, a more awsome webintroduced more experimental features currently supported by a limited amount of browser. Nevertheless, some of them are promising when widely supported and I noticed the following interesting features:

  • Using the css @-viewport feature you can define size of your page elements, image and font based on the screen resolution of the device, which is perfect for a responsive design page.
  • The introduction of CSS variables using -var- (only in beta in chrome for now) will help for sure front end developers.
  • The position sticky to manage sticky element that roll or disappear based on certain conditions (for example keep an header at the top of the screen or replacing H2 elements when scrolling down) and css clip-path let you crop and clip any image based on certain conditions looks promising to develop nice and fun web application.
  • The clip-path option will also help for responsive design when combine with the viewport feature.
  • The web audio and speech api (only in chrome) let you to records and transform sounds directly in the user browser, so you can offer google voice / siri like features to control your application.

Watch the presentation for the full list of feature introduced (or check the presentation)

In the meanwhile you can go on chromestatus.com to see which browser support which features and use the CSS supports to test if the browser support a specific feature and return true and false statement so you can defined fall back event accordingly.

Google I/O – Google Visualization API

Overview: Google Visualization API works with JSON as an input source and produce interactive HTML5 / SVG chart. Currently 12 type of visualizations are available using a different packages. If not specified the API select the best color and scale to display the data.

Nice feature: As it already works in Google Fusion Table, the map package automatically detects country, states and other location name and display them properly on the map.  User still have the option to defined long / lat coordinate for specific points.

Read the API documentation.

Migrate (or how to escape) from soup.io to WordPress

 

I’ve been using soup.io for over 6 months to save my twitter stream, collect nice music video and host some personal articles. Due to the “not that professional” maintenance of soup.io (several long downtime) and the lake of feature (can’t create and manage tag cloud or category other than manually, search feature is not working), I decided to move to WP and do my own stuff.

The migration of 6 months of data collection from soup.io to WP has been a long and painful journey. Soup.io rss export did not contains all my post (over 500) and was not recognized by WP properly (using the native WP import rss feature).

 

So I’ve look up for a way to move my data using a set of different tools. Below is a quick tutorials describing my main step and the tool I used. At the end of this article an other solution that might work as I did not try it.

Please note that during this migration your tag, guid and publish date will be lost. If you have post from google reader, guid (ie link to the orginal article) will be lost too – I guess my cleaning in google refine lost them.

  • Extract all your posts using the soup downloader (thanks monschein). Soup downloader will do a post is a xml document. So unless you want to import all your articles one by one, we need to have them into a single file.
  • Put them back into a single file using Replace Pioneer (access tutorial – download) to create a single xml document
  • Rename this document as .txt
  • Now we have a nice xml document, with all your post, we want to make it ready to be imported in the wp_post table. To do that we will use google refine  a great tool to clean messy data.
    • create a project by importing your txt document (do not split into columns)
    • Apply the following code using the option apply. Copy every thing and here we go !

 

 

    • Extract data in Excel format.
  • Create a wordpress blog. I won’t describe this step, there is already tons of excellent tutorials all over the web.
  • Import your Excel file in the wp_post table using phpMyadmin interface. Again, there is tons of good tutorials over the web.
    • It has been the longest and most painful part. The import did not happen properly and I had to run a couple of sql queries to rearrange the data properly (in the right field / format …)
  • Connect to WordPress, all your post must be displayed. Select them all and publish them.
  • Install feedwordpress plugin and configure the import you had previously with soup.io.
    • feedwordpress is a rss importer that turn every element in the rss will be turn into a blog. If the element contains tag or category
  • Configure and have fun with WordPress

 

An other option I did not explore, but might work is to:

  1. install a WordPress instance with feedwordpress plugin
  2. configure your soup.io rss.
  3. run the feedwordpress plugin to import the x first elements from soup.io
  4. delete imported element in soup.io
  5. run the feedwordpress to import the next elements from soup.io
  6. keep repeating 4 and 5 until your soup.io is empty.
Advantages of this methods (if it works):
  • Do not need to use 4 differents interfaces
  • Import post tag and create them into WordPress.
Hope this help. If you have questions, and idea to improve this methods, I’m interested to hear them !

Smartboard

Smart board (white board) + smart notebook (software)
Advantages
1. Write down your lesson and export it as pdf / html / ppt. Possibility also to record the lesson
avoid student to copy what the teatcher write on the screen.
2. This is a single application, acting like a layer on windows interface, to add and manipulate contents on the screen (highlight content, screenshot, write over content …)
3. Very close to powerpoint and other MS tool, this make the learning curve from teacher shorter.
Drawbacks
1. User have to move a lot, can be tiring all day long.
2. Single touch interface. Only one user at a time on the board (some collaborative extension using personal pc / tabletts seems to exist). Would be nice to have something like Windows surface or apple mutlitouch technology.
3. Miss some quality content available on Internet. Preparing interactive lesson is highly time consuming.