Skip navigation

Tag Archives: user interface design

Several weeks ago, Google rolled out (read forced) its new UI for Google Analytics to all users. I’m really not quite comfortable with large-scale UI changes so, for the first few times I used it, the first thing I did was to click the “Old Version” link at the upper left. But eventually, I got tired doing that so I conceded to learning my way around the new UI. It seems like it’s here to stay anyway so my attachment to the past is rather futile.

I initially found the new UI too alienating. Unlike the UI changes Google has been rolling out for its other products (GMail, Docs, Reader, etc.) the change for Analytics seems too drastic in my opinion. Its greeting page is very uninformative, compared to the old one. See for yourself.

Old UI (retrieved via the only good thing in Analytics’ new UI—the “Old Version” link)

Old Analytics welcome page - NICE

It's informative at first glance. You get a quick overview of the statistics for your website.

New UI

New Analytics welcome page - CRAP

New welcome page. Useless. Needs two clicks from here to anything useful/informative.

(I’m sorry that you have to see my obviously-dummy account test.skytreader.net. I promise to explain after several paragraphs.)

I actually gave Google some benefit of the doubt for their new UI. For one, I don’t really do anything with the statistics of my websites beyond vain ego-feeding. Maybe, just maybe, the new UI is meant for those who actually design their pages based on statistics, those who decide on a hue of blue based on the number of hits it generates. Beyond this post at the Google Analytics help forums (hey was that just posted yesterday?), I haven’t found anyone else frustrated by the new UI.

But aside from the two-hits-before-any-info complaint I already have above, here are a few more of Google’s UI decisions which frustrates me.

(1) “Make this version default” (see new welcome page image above)
What? Make what version default? If by “this” you mean this horrifying version which, by behavior, is already the default, then I’m totally confused as to the necessity of displaying this link. I haven’t dared click on this, in case more horror pops up.

Related (but not really Analytics): I remember seeing this way back but it’s minor and a bit cute if you ask me. A quick Google search for “google what is more than everything” returns nothing (even search is crap now?). If anyone finds the original complainant, I’ll be more than happy to link back. Pardon my shaky brush.

Google search side bar

Google, Google, seriously, what is more than everything?

(2) So, how do I add a new account/profile again?
It’s easy to track a new website in the old UI. You see, when you select an account, you get to your profiles list which has this nifty link at the lower left

The closest I get to my profiles list in the new UI is this.

Profiles in the new UI

Where to now, Google?

But hey, the keen reader will point out, you managed to add your obviously-dummy test.skytreader.net. You should’ve found a way to add one.

I honestly don’t remember how I did that. I think I clicked the cogwheel icon at the far right of the new welcome page. I was taken to a page which, for all I remember, was something in between a settings panel and a help panel. But hey, at least I managed. Google gets some points for that.

(3) And now, I explain my dummy
For quite some time now, I’ve noticed that hits to {kode.play();} has decreased. Nothing surprising about that, as I’ve noticed that hits to {kode.play();} tends to oscillate. The hits usually come from searches for terms like “solvability of the n-puzzle“, “n-puzzle“, “install opencv” (or “install opencv ubuntu“), and hey, even Azeus-related search terms. The hits come from countries like USA to India and I’ve come to believe that those who are searching are (CS?) students assigned to/encountering these problems.

But this time the hits dipped drastically. So, I decided to poke around the internals of my site to verify that there’s nothing wrong on my part.

(Warning: Techie talk ahead)

To install Analytics on your website, you typically insert some lines of JavaScript code somewhere in your site. Google advises that you put it before the closing head tag. I’ve always done that being that two of the three sites I track were built from the ground-up by me. However, when I put up {kode.play();}, whose base code came from WordPress, I had to put my tracking code in my theme’s footer.php (a PHP include file, hence it loads for all my pages).

Sometime ago, the WordPress theme I am using updated, erasing my little tweaks on its files. The CSS-related tweaks was easily spotted and remedied but I didn’t know that the tracking code I inserted in my footer.php was also erased, and hence Analytics can’t collect statistics for my site.

What frustrates me is that Analytics didn’t tell me that it isn’t receiving any tracking data from my site. To be fair, even when I switch to the old UI, Analytics doesn’t report anything unusual for {kode.play();}. Here’s when I decided to add my dummy profile, test.skytreader.net.

And I found out, to my further ire, that it seems that the new UI really has no facility to tell you if your site is sending tracking data or not. Or if it has, it is very well hidden, kudos Google. At least the old UI will show me this for test.skytreader.net:

Analytics reporting that my dummy profile isn't sending data, as it should

I still have to find the equivalent of this exclamation mark in the new UI.

Well, that’s what prompted me to do this rant. I don’t usually rant especially when I know just how difficult doing something is. But Google, I really expected better from you.

Lesson learned: When using Analytics in WordPress, skip copy pasting the JavaScript. WordPress has various plug-ins for Google Analytics tracking. I’ll be trying out the one made by Kevin Sylvestre.

Week two proved to be surprising in a lot of ways. I didn’t code much (I didn’t code at all last Wednesday) and there were more group meetings than I expected. We spent it laying down the foundations for our project. That means coding the basic functions for some, creating database schemas for others, and doing user interface (UI) related stuff for me.

UI is an interesting thing. I’ve coded quite a lot of projects already, personal and academic, but only in a few of them did I consider the UI seriously, mainly because for the most part of those projects (academics, *hem**hem*) the requirement was purely back-end (i.e., functional but without UI) code. I’ve read quite a lot on it but my most considerable brush with UI design was in my Software Engineering class. What makes it particularly challenging to me is the amount of cognitive psychology involved: elements must be intuitive, the transitions from screen to screen must be logical, users must not have a hard time navigating around the features, etc.

I’m doing UI largely because of my considerable proficiency in Photoshop. I’m not a god, heck no. But I’m pretty good at it that I can make decent freemouse images in a matter of minutes, making good use of layers that I can easily make variations, should they be needed.

It’s actually been a long time since I last used Photoshop. The last version I used was CS2 and it’s now at CS5. The last Photoshop job I’ve ever done was on my personal site. Every image-job I did after that was done in GIMP and, setting aside my FOSS fanboyishness, GIMP is still a very far cry from Photoshop’s awesomeness. So, I’m quite pleased with myself that I still remember where to find what around Photoshop.

I can’t really post my creations because I think that would fall under my lips being sealed. But I can tell you about the nitty-gritties of designing a UI for Android.

1) The screen is small and its size varies across devices.

I’ve done UI for desktop applications (not much problem; just let Swing/AWT’s Layout Managers do the job) and web dev (absolutely fantastic if not for the fact that Internet Explorer is such a pain in the *$$) but this is my absolute first time for a mobile device.

And the most obvious challenge for Android is its screen size. The fact that I’m designing overlays for Google Maps doesn’t help much either. I try to keep the opaque areas of my overlays to a minimum so as not to appear intrusive on the Map.

And the varying screen sizes? Sure it’d be easy to call some system function determining the screen size then resize according to that. However, this leads us to my second point which is…

2) Android’s Canvas class doesn’t seem to have a resize() method or something for Bitmaps. To resize Bitmap objects, you need to use a Matrix.

Or, at least, I haven’t found any easier way yet. Not much of a nuisance except that what takes a single line in java.awt takes around 4-5 in Android.

3) The screen size varies across devices.

Just wanted to say it again. I love open-source but when the issue of screen size came up in our meetings, I can’t help but think fragmentation.

Three points for the three days of week two seem fair enough. Till next time. ~ The Chad Estioco