When we talk about Google, we are talking about a company that doesn’t do things without the “know how” and the “know why” principle. Google has been preparing the ground for it’s operating system the last 3-4 years now and July 2009 was not a month that Google’s CEOs woke up and said “Hey, lets make an operating system”.

Fake image I made based on my imagination about Chrome OS

Lets see what Google says to us about the Chrome OS:

Speed, simplicity and security are the key aspects of Google Chrome OS. We’re designing the OS to be fast and lightweight, to start up and get you onto the web in a few seconds. The user interface is minimal to stay out of your way, and most of the user experience takes place on the web. And as we did for the Google Chrome browser, we are going back to the basics and completely redesigning the underlying security architecture of the OS so that users don’t have to deal with viruses, malware and security updates. It should just work.

Note the keywords above:

• Speed
• Simple
• Secure
• Web based

Let’s analyze the text above and try to imagine how Chrome OS will look, work and behave.

Speed

Google says that Chrome OS will be fast and lightweight. The user interface will be minimal, so the only thing I can think of is that the Chrome browser will be the main application and the File Manager of this operating system. The OS will load the necessary drivers for Internet connection and Chrome browser will load upon startup of the system.

Simple

Since the only application to load on the operating system is the Chrome browser, most of the time users will be using the browser to do anything. Some other applications might exist as standalone programs but not on the default install of the system.

Secure

Being secure is something time will tell. Based on my speculations though, security will be achieved from the philosophy of the system. Chrome OS will be focused on cloud computing. This takes care of viruses since nothing needs to be installed on the system for applications to work. If we count in some technologies that are on their way to production stage like HTML5 and it’s storage database, applications will be able to work offline too when Internet connection is not available.

Storage

Chrome OS will probably be using an online service for storage. With a variety of services available on the net, it will be a piece of cake to add storage devices on your PC. I assume that classic storage devices will also be supported since Chrome OS will need it to store itself.

Users

Chrome OS will allow many people to work on the same machine, allowing remote connections on the system with a “Sign in with your Google Account” dialog where each Google user will be able to login to the system provided the PC owner gave access to that user. The same thing that happens with your Adsense or Analytics account.

The Desktop

A Google Wave aware desktop will be able to allow users to collaborate and communicate right from the desktop. Even if having a desktop will be an option.

Applications

Here is a list of some applications for the new OS. These will not be just web shortcuts to their online versions but standalone applications that will be using APIs to operate:

• Media Player: YouTube
  Available as a standalone app. Google is serious about HD on YouTube and by using a standalone version of YouTube is nice way to deliver high quality movies to the user.
• Image Manager: Picasa
  The existing Picasa application and Picasa web albums is a great example on how most of Chrome OS apps will be.
• File Manager: Chrome
  Even if by making Chrome, the default file manager of it’s operating system, would raise some complaints about monopoly from it’s users, this is how the whole thing is in my head.
• Office: Google Docs
• Calendar: Google Calendar
  Able to manage your tasks in real time with other users with a heavy usage of the CalDAV API.
• Image Editor: SketchUp
  Just like Picasas case.
• Collaboration: Google Wave

Google’s new language “Go”, will have it’s share on the Chrome OS. Many applications delivered by Google or third parties will use Go’s compilers to build executables and apply upgrades and patches. This allows more thoughts on how Chrome could be used for developing purposes.

The wait is over?

When i tried to find some images to use for this article, I stumbled upon this post that states to have installed Chrome OS and gave some screenshots to the public:

Image of a said to be : Installation of Chrome OS

System Setings

I saw these images after the article was finished. Honest!

Robbots:

• Calcbot
  This might prove to be a time saver when you need to calculate a very hard calculation like : 5 + 2 (3^5)%6 . All you have to do is add “—” after the equal sign. eg: 5 + 2 (3^5)%6=— and Calcbot will answer it.
• i-cron
  Evaluates Python expressions. Looks at blips in event, searches for CALC() macros and executes Python code using exec().
• kasyntaxy
  Awesome robot. It does syntax highlighting of a variaty of languages like : Python, C, C++,JavaScript,Java and more. Must have tool for developers.
• Plotzie
  Plotzie creates sparklines from data that you give to it inside a wave.
• WaveAlpha
  This bot will use WolframAlpha’s knowledge to get results for anything you ask.
• WaveGroupy
  The bot automatically adds a group widget, which you can use to browse the neighbourhood, and add/remove your wave to groups.
• Link – Easy Robot
  Multifunctional robot with optional panel and live easycode to perform with. like make-public, emoticon, sweepy-empty, lock-title, insert gadget and more.
• Rssybot
  Great tool for using wave as a feed reader. You add the robot with the extensions installer and then you have another option under the New Wave button. Enter a feed URL and press subscribe. Every new feed entry will show up as a blip in your wave.
• Wave Live Messenger
  Your friends don’t have a Google Wave account yet? No problem. With this extension, you can talk to them on their MSN right from your waves.
• Aunt Rossie
  Translate languages.
• Bit.ly Bot
  Shorten URLs from within your waves.
• Chart Bot
  Used to display various charts and diagrams based on Google Visualization API within a wave.
• XMPP
  Allows you to subscribe to waves so that your receive notifications via XMPP when users modify them.

Gadgets:

• Approver
  This gadget will add a vote feature to any blip you add it so people can upvote or downvote you.
• HTML
  Allows you to embed HTML in any wave and edit it whenever you want. This is a great tool for working on files with others.
• iFrame
  You can load any webpage as an iframe inside a wave.
• iWave
  Link your Facebook account with Google Wave.
• Vector Editor
  A real time vector graphics editor.

Firefox Add-ons:

• Google Wave Notifier
  If you have a Google Wave account, enter your login and password in the settings and it will log you in and notify you of new wavelets in your inbox.
• WiseStamp
  Enables you to share your Google Wave contact info in your email signature.

Chrome Add-ons:

• Google Wave Scrollbars
  Converts wave scrollbars to the default system scrollbars.
• Google Wave Checker
  The same as Google Wave Notifier in Firefox.

The CSS Filter Property

Internet Explorer supports a filter:command style CSS property that can add some style to HTML elements on your pages. For example you can create a fade effect on any block element on your pages with:

ELEMENT {filter: Chroma(Color=#C1DEFF) Alpha(Opacity=200, FinishOpacity=0, Style=2, StartX=gradient start X position, StartY=gradient starting Y position, FinishX=gradient finishing X position, FinishY=gradient finishing Y position)
}

where “ELEMENT” is any block element. You can use the above code to transform this image:

to something like this:

You can also create gradient div elements with the same trick. Another great method of the filter property is “filter:gray” which, when used on images, the images will be gray-scaled. So by doing this:

img{
filter:gray;
}

will display the image like this:

while by using the “filter:fliph” or “filter:flipv” methods, the images will be flipped horizontally and vertically accordingly. The next cool filter method is “filter:invert” which when used on images, would display the image like this:

Another image transformation can be achieved with “filter:wave“. You might have guessed what this method does but if you didn’t, put this code in your page:

img{
filter:wave(Strength=5,lightstrength=15)
}

and you should get an image with a wave effect like this:

A method similar to the “filter:invert” method is “filter:xray” which produces the following effect:

wait.. There’s some more.

You can pixelate any image with this code:

img{
 filter:progid:DXImageTransform.Microsoft.Pixelate(maxsquare=6)
}

eg:

add some blur with “filter:blur(strength=VALUE)“:

img{
blur(Strength="50")
}

or add some glowing effects to some text and keep the text selectable as shown here:

with this code:

p{
filter: glow(Color="#000eee",Strength="6");
 width:200px;
 font-size:30px;
}

and adding shadows to text can be done with this code:

p{
filter: dropShadow(color="#ddd0d0",offX="2",offY="2");
 width:200px;
 font-size:40px;
}

The result is not 100% what we expected though since the transformation sharpens our text:

The MSDN site has a lot of info about the filter property and some other IE specific CSS properties in case you are interested in it.

We do not advise you to use any of these CSS properties on your pages here. We are just trying to show that some of these properties could be added to other browsers too, since most of them have to do with presentation and style. For example why use a heavy JS library to add some effects like fade or gray-scale when you can do it with 1 line of text?

For flame lovers:

We use Opera (70%) and FireFox (30%). So, no IE lovers here…

The Google Chrome Experiments page is a showcase of cool experiments for both JavaScript and web browsers created by designers around the world. This place has more than interesting experiments. Ideas and some of tomorrow’s “killer apps” might reside there waiting for someone to use them or be inspired by them.

The most noticable experiments in my opinion are (Tested on Firefox3.5 , Opera10, Google Chrome and Internet Explorer6):

Your World of Text (by Andrew Badr)

From the author:
Your World of Text is an infinite grid of text editable by any visitor. The changes made by other people appear on your screen as they happen. Everyone starts in the same place, but you can scroll through the world using your mouse.
Technology:
Django and jQuery (on App Engine)

The most interesting is that whatever you type, stays there for ever, untill someone writes on top of your message. Runs smoothly on :

• Chrome
• Firefox
• Opera

Internet Explorer has some issues.

Idea on how it can be used: What if someone created a social service based on this experiment?

Javascript 3D Model Viewer (by Jacob Seidelin)

From the Author:
Javascript 3d Model Viewer is an experiment realyzed with javascript and canvas element (HTML 5).
It’s possible to view 3d models (dinosaur, ship, helicopter), rotate them, change color and transparency and add a motion blur effect.
Technology:
Javascript, Canvas (HTML 5)

Awesome for showcasing some of your 3D work. Runs great on :

• Chrome
• Opera

It is very slow on Firefox and guess what… It does not run on IE.

Idea on how it can be used: Displaying 3d sketches from within your pages.

Canvas Sketch (by Henrique Moreira)

From the Author:
Web-based drawing app using Canvas Tag.
Works on Chrome, IE6+, Firefox 2+, Opera 9+ and Safari.
Components: Pencil, Eraser, Line, Rectangle, Ellipse, Flood Fill, Color Picker and Undo.
Save as PNG, GIF or JPG.
Technology:
Javascript, Canvas, VML and PHP

Idea on how it can be used: Obvious. An online painting app.

JuicyDrop (by Jacob Seidelin)

From the Author:
A limited JavaScript/canvas port of the WinAmp music visualization plugin MilkDrop. More details at: http://blog.nihilogic.dk/2009/03/javascript-canvas-sm2-milkdrop.html
Technology:
JavaScript, Canvas, SoundManager2

This is one of my favorites. It supports visualizations too. No it is not Winamp. It is JuicyDrop. Runs on Chrome and Firefox. Even if Opera renders it nice, it was not able to play any song.

Idea on how it can be used: Some music on demand services might find a great way to promote their service by using this one.

BoomBox (by Scott Andreas)

From the Author:
Boombox is a web-based media player with a three-channel equalizer. The volume of each channel is controlled by resizing the respective windows.
Technology:
Prototype and Flash

This is my second favorite. Runs great on :

• Chrome
• Firefox
• Opera (Faster than all other browsers!!!)

Again Internet Explorer fails to render the experiment. Although the music plays ok and the browser windows render nice, you can’t resize them to get the experiment’s result.

Idea on how it can be used: As with the JuicyDrop experiment, the BoomBox can be used by a music on demand service to attract more users.

Browser Ball (by Mark Mahoney)

From the Author:
Open new windows. Throw a beach ball through them. If I tell you it’s less lame than it sounds, will you give it a shot?
Technology:
JavaScript, the canvas tag

A very amussing experiment. The ball bounces through the open windows.Runs on Chrome, Opera and Firefox.

Idea on how it can be used: Can we make animations that occupy more than one browser window?

Ball Pool (by Mr.doob)

From the Author:
Start by shaking the browser, then create new balls (click on empty space), move some others (drag) and reset the screen (double click).
It’s like the old days once again! :)
Technology:
javascript, canvas, box2d-js

Just awesome. Runs great on Opera, Firefox and Chrome.

Idea on how it can be used: Left as a challenge for you. I have one idea and it will be posted on a feature article here.