Google I/O 2018 codelabs

https://codelabs.developers.google.com/io2018

by marcacohen • 8 years ago

110 11 8 years ago

codelabs.developers.google.com

The mobile version of this site is seriously crippled; it doesn't allow filtering and runs pretty janky. Whenever you scroll it activates the ripple animation for one of the cards, which is very annoying.

On desktop... It's also very bad. Has it seriously gotten this bad at Google? Maybe I should call for an interview. If you're going to hijack navigation, at least get it right. Most modern web browsers have tabs, allowing you to keep multiple links open at the same time. A common usage pattern is to browse a large collection and open the links of interest in tabs, in order to work your way through them later. If you have a mouse with a scroll wheel, you'll usually use the middle button to open links in a new tab. However, if you have a trackpad you'll use cmd+click on macOS or ctrl+click on Windows and GNU/Linux to open links in a new tab. This is the default behavior and it works perfectly out of the box.

The navigation issue is easily resolved by opening the console and replacing the navigate function. Setting it to an empty function does the trick:

    app.navigate = () => {}.

The annoying ripple animation can be removed with CSS:

    var style = document.createElement('style');
    style.type='text/css';
    style.appendChild(document.createTextNode('paper-ripple { display: none; }'));
    document.body.appendChild(style);

Another bug: in the tutorials, navigating to a different step preserves your scroll position instead of resetting to the top as expected.

Their WebAssembly Physics and DOM objects tutorial [0] is worth checking out if you wanna see a quick example of WASM in action.

[0] https://codelabs.developers.google.com/codelabs/hour-chipmun...

4x3l2• 8 years ago

Thanks for the feedback! I dislike the ripple animations, too. This is coming from Material design implementation in Polymer components 1.0.

Hijacking navigation wasn't very nice either, absolutely agree. Too bad we didn't have time to drop it.

All of this is going to be replaced soon. Codelabs site is moving away from Polymer. Working on the new implementation in https://github.com/googlecodelabs/codelab-elements. Contributions are most welcome, of course.

candiodari• 8 years ago

Sadlly even this monstruosity is way better than the google I/O website itself. When push comes to shove ... it's a list of videos, and perhaps a schedule.

There's a big bar at the top with the title. Then a tiny bar with the videos, and then a solid 2/3 of the height dedicated to the "feed". I mean come on.

It doesn't take resolutions into account at all. At 1366x768 (apparently the most common web resolution) you can only see the title bar, "day 1" "day 2" "day 3" (clicking on them, of course, does not bring anything into view, you have to click, realize that it's not a link but a single page app, and then scroll to get it in the middle of the screen) and the text "highlights". Other than that, useless marketing picture/backgrounds and "design", which apparently means whitespace.

The schedule, the other main reason people would visit that site, cannot be seen on the main page with my browser at 4k (!). Although of course the only things resizing are the marketing picture that is the "title bar" of the page and the 2 links at the bottom.

Is this supposed to be good web design ? Because I actually find the youtube videos listing, which is designed explicitly to distract you away from the videos more usable than the I/O website.

"Make information universally accessible and usable", indeed, except of course when marketing prefers pretty pictures that half of the web has grown completely allergic to. I mean, the pictures are not as repulsive as most business websites, but ...

mathnode• 8 years ago

It feels so inhuman. Like everything google, there are no names, no faces, no citations. Just walls of information and puzzles. Khanacademy has gone a similar direction; they have removed the human element from learning and are not hiding that fact. Even scam emails at least try to pretend they are genuinely sent from humans.

My favourites are still coursera and MIT OCW. They may not be the most perfect web technologies, but the landing pages right now contain people, faces, names, places and history.

I think this is the dystopian model of learning. We are faceless droids to them completing emotionless tasks. And to what end? So that one day a future generation might be able to qualify for a job that the AI is not capable of doing? If my grandchildren solve enough puzzles in the VR-web-o-sphere they will qualify to be blessed by, The Google. THE Google!

some_account• 8 years ago

I prefer this to marketing faces.

Marketing faces are random actors and models, not having anything to do with the product, so it's a dishonest relationship from the start. It's designed to manipulate you into thinking the product is more genuine and is used by people you can look up to, and thats why you miss it now. You miss being manipulated.

A colleague of mine is bashing open source a lot because it sometimes has humor, like 'ooops a funny thing happened' or 'taking the poison pill' instead of 'We apologize for this error, please contact customer support bla bla'.

The windows attitude is also 'sit back, we are taking care of you' while the Linux experience is more genuine, less polished.

marcacohen2• 8 years ago

The lack of a human touch on this site is simply a function of our priorities. This site was developed by volunteers, in the proverbial Google 20% style, and we've put very little effort into marketing. Admittedly, it could stand a bit more warmth, but, for better or worse, we've always put our focus on the content -- giving developers a fast track to building something fun.

imglorp• 8 years ago

I can't stand marketing faces. I don't need a pretty actor reading the copy, like the Socratica stuff.

I'd rather have the expert, with all their eccentricities, presenting their own stuff, like Walter Lewin or Leslie Lamport or any of the Numberphile stuff.

4x3l2• 8 years ago

Those codelabs and the website were originally designed for on-site experience where you can sit down and try something new without the need to bring your own laptop or another piece of hardware and set up the environment.

In fact, I'm sure anyone who's been to I/O event in person noticed quite a few friendly faces and field experts to talk to in the codelabs room. Often, they are the same people who wrote the actual codelabs.

Then we thought, why not make these codelabs public for people to also be able to try it at home. So, there it is, inhuman codelabs.

hdlothia• 8 years ago

Interesting that I couldn't find any golang content

Google I/O 2018 codelabs

Related Stories