Skip navigation

Category Archives: Andrei’s Adventure At Azeus

At last. We’re doing what I really anticipated us to do. If you know me, I wouldn’t need to spell what that is out. Clue: It doesn’t have anything to do with ice cream or chocolate *wink*

But before I relate this part of my adventure, we sidetrack a little first into...

Dramatis Personae

Module GundamX. The module I am assigned to, under a nickname I myself gave. I just thought of giving it a nickname as it feels awkward and a bit impersonal referring to it through phrases such as “the module I am assigned to” or “the module I’m working on”. Much shorter too! I know it’s not as cool as tech products are meant to sound but I’m exerting effort not to have any Freudian slips here.

Project GuitarHero. The project, of which Module GundamX is a part of. Again, a nickname of my own devising, for purposes the same as above.

And lastly,

The Chad Estioco. The awesome author who gives nonsensical names such as Module GundamX or Project GuitarHero. He thinks all alliterations are awesome and loves ice cream, chocolate, and coding.

Right. That applies for my next few posts as well.

My bad. GuitarHero sure grew a lot while I was Photoshopping UIs. I wonder how large our SVN repository is right now. The first time I checked-out a copy of the project’s files, it has been revised around 800 times already. The most revisions I ever saw on a project prior to this was around a hundred. After 800 revisions, there were already a lot of files and the directory structure was starting to get pretty deep. Scrolling through my workspace in Eclipse feels like watching a tediously-(un)spaced closing credits of a movie whose actors have names like GundamXActivity.java, GuitarHeroConstants.java, etc.

I’m done with one out of the three parts assigned to me. Or, at least, as done as I can possibly get for now. I already have some scratch code for one of the two other parts, and the last one sounds pretty easy and I hope to start and get pretty finished with it before Friday’s presentation.

Some of the base classes I need aren’t fine-tuned yet and I’m still learning how our mentors implemented networking on our project. They used jWebSocket and it is something very new to me; I’ve just grasped the basics of the API our mentors designed.

And, man, the code from our mentors amazes me. I see them use Java constructs I’ve either heard of but never used, or never even knew existed (assertions, anyone?). Even as I sell my programming soul to the minimalist syntax of Python or to the parentheses of Scheme, I realize that I still can’t claim full mastery over Java. Poor me.

Guess that’s it for now. I still need to code. 😀 ~ The Chad Estioco

Disclaimer: This post is merely schooled speculation. All inferences were made in a matter of minutes to at most an hour without rigorous analysis.

Disclaimer #2: Warning. Contains numbers. L0ts 0f numb3rs.

Right. You’ve been warned. Let’s start.

Last week wasn’t exactly a code-less week for me. I coded, last Friday, albeit only a short equation consisting of a few lines or so of code, which nonetheless took me the better part of the morning to derive. It’s some sort of a ranking system but I wouldn’t talk about that. It wasn’t exactly complicated but I wanted to do it as purely mathematical as possible—that is, using as less programming constructs as I could—and that’s the difficult bit. I was never really one for maths.

To cut a long story short, the equation didn’t behave as I expected and I, again, spent the better part of Monday in front of Eclipse figuring out a way to do it. In the end, with the advice of one of my module mates, I settled with using percentiles.

My ranking system divided the [0, 100] range of the percentile into 6 partitions: [0, 5]. The first two partitions range over [0, 10] and (10, 20]. The remaining four partitions divided the range (20, 100] equally amongst themselves.  To test the function I coded, I wrote a small Python script that will randomly generate a data set for me. My Java code then analyzed the data set and produced some statistics.

Before I proceed, a little side story: I know that, speed wise, Java and C rule the world, and Python is somewhere down the continuum with Ruby. I value speed and efficiency but I’m currently fanboying over Python due to its very beautiful syntax. I admit to be at times deluded by this minimalist syntax into thinking that Python is faster than “sluggish” Java, with all that boilerplate-y syntax. With my experiment today, all my delusions have been shattered. My Python script, whose sole job was to print out a random data set*, took a lot of time; I can even watch as the lines printed. Java, who had to compute percentiles, analyze results, and generate a small report, executed in a flash.

*Although, to Python’s credit, it had to generate pseudorandom numbers (duh!). Wonder how much time, that takes.

I generated five data sets. The first three data sets had 101 items, the last two had 500. I know that my sample is small but I’m not there to gloss over statistics so they’d have to do. Anyway, the results surprised me.

The first three data sets produced the same distribution and so did the last two. What’s more surprising is that the distribution seemed too clustered; I expected a bell curve but I seem to have produced only values concentrated around a certain point.

Statistics:

Data set size: 101, for 3 runs:

Partition 0: 11
Partition 1: 10
Partition 2: 20
Partition 3: 21
Partition 4: 20
Partition 5: 19

 

Data set size: 500, for 2 runs:

Partition 0: 51
Partition 1: 50
Partition 2: 100
Partition 3: 100
Partition 4: 100
Partition 5: 99

 

(Remember that both Partitions 0 and 1 are only half the size of each of the other four partitions.)

I panicked a bit at this point. Was there anything wrong with my implementation? After all, this must be the first time I dealt with statistics in my code. I even asked the opinion of one of my module mates.

That’s when he pointed out that the data set was, itself, randomly generated and it is quite possible that the randomly generated data itself was already concentrated to begin with.

I used Python’s rand.randint method. I skimmed through the documentation and it seems that Python’s random library has functions specifically for generating normal distributions but randint doesn’t seem to be one of them. Hmmmm?

Edit (05/10/11): I won’t be delving into this further but I just realized that I must’ve expected the bell curve in my results too much. randint must be returning a uniform distribution, not the clustered part of normal. It’s a poor choice from the start. Should’ve used random.gauss or random.normalvariate instead.

[CLOSED]

(Though I also wonder if it’s alright to expect a bell curve from percentiles, given my data set size? Wikipedia tells me that “In general terms, for very large populations[,] percentiles may often be represented by reference to a normal curve plot”. Maybe, my data set just isn’t large enough.)

Your statistics scientist,
~Chad “The Rocket Statistician” Estioco

I miss coding. The period between my last update and this was a period of fast-changing requirements, Photoshop, and deadlines. It was so busy that I had to put in some mini-overtimes to the effect that, by April’s end, I’ve already clocked in at least 100 hours of work, at most around 108.

Throughout the said period, I’ve had moments where I thought I should’ve volunteered for the API team. They were the ones who got to code a lot, and coding a lot is something I do even while sleeping. But I’m thankful that I had the crazy urge to sign-up for the UI team. UI isn’t something I get to do everyday (cf. my previous post) and, at least, I learned a lot of new things.

Take wrong turns. Talk to strangers. Open unmarked doors... Do things without always knowing how they'll turn outA Toast to following crazy urges from xkcd. Pun intended.

Is there a school teaching UI design as part of the curriculum? The closest my schooling has ever taught me about UI design was a few slides of PowerPoint, all discussed in a single meeting. In any case, I don’t really think that UI is something you can learn from school; it’s more about practice than theory.

The first thing asked from the UI team was to design an icon set. After 146 discussion messages over at Google Wave over 88 images—UI layouts and icons alike—we ended up agreeing to use a pre-made icon pack from the internet. Wow. I never knew that there are free and legally downloadable icon packs from the internet. I seem to have forgotten internet rule number whatever that states “If you need it, you can download it from the internet”. Everytime for those few times that I had to design icons for a UI (in our Software Engineering project, for instance), I always built them starting with an empty canvas of Photoshop/GIMP; I have too much pride to use the work of someone else—especially someone not a part of my team, someone I don’t know personally—even if offered for free and in good will.

Sigh. So much for being the man who always built things from the ground-up.

Photoshop, for all its awesomeness, isn’t a very nice prototyping tool in my opinion. I don’t know much about prototyping tools but a good one, I guess, will allow me to define a base template and then build screens from that. Any changes on the template immediately reflects on the screens created from the template. Something like CSS. Or MVC, save that I’m only interested with the “Views” this time.

Then again I don’t really believe in prototyping using images. The only time I was asked to prototype prior to this was in my Software Engineering class. Throughout the first 3 consultations our teacher advised our team to use prototyping tools and all 3 times I stubbornly proceeded with my approach. I had my team prototype using HTML and CSS directly, my rationale being, we’ll still code that later anyway so why bother using prototyping tools?

(For all my stubbornness, we got a grade of 90 out of 100 during the prototyping demo. The ten points deduction came from a few screens I totally forgot about. That was, if I remember correctly, the highest grade given during that demo. But that’s another story…)

The requirements changed faster than you can say “Photoshop”. But with every iteration of the design I slowly realized that we are no longer just making a product. We are crafting an experience for the user to feel.

Sideshow: Selling a Product vs Offering an Experience

A product is sold. User can type on the text box, the buttons are tappable, stuff function. Amateur. Awesome.

An experience is offered. User can type on the text box and screen reacts dynamically based on user input. The buttons are tappable and functional and they look and feel soooo Android. Professional. MORE AWESOMER!!!!

For comparison, this is the Google IO App for this year. Notice the toolbar.

(Image taken from http://www.androiduipatterns.com/2011/05/google-io-2011-android-app.html . Plus, more Android UI design tips and examples!)

I guess my biggest handicap in this part of my adventure is the fact the I have never used Android apps (I don’t even have an Android phone!). I don’t even use mobile apps for that matter. My XpressMusic phone is capable and loaded with some apps but I’ve never used them. The most used apps of my phone is 1) the music player, and 2) the camera and their amount of use is different by a very wide margin at that. How do I design an experience for something I’ve never experienced myself?

But still a lovely learning experience, designing an experience for something I never experienced yet.

Looking forward to code finally next week,
The Chad Estioco

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

My lips are sealed. In the process of blogging about this whole Azeus adventure I need to be extra careful in what I say, lest I reveal some company secret, and pay a whooping PhP 5,000,000. Hence, I’m making it a point not to talk about the project itself but about the technologies I’d encounter for the next few weeks.

The project was divided into modules and we were grouped according to that. Sir Zhen, the person in charge with this whole internship, told us that he grouped us according to school. Now, I have no objections with working alongside UPD people but I was hoping that this internship would be an opportunity for me to see how people from other schools work, code, and think. In the end, I got what I wanted as my co-interns for the module I’m assigned to comes from UPLB and De La Salle University.

So, we’ll be working on Android, Google’s version of an iPhone killer. I haven’t any experience with Android so I’m thankful that they gave us the first week to play around with the technology. Like everyone on the internet, we’ll be using the Android SDK plug-in for Eclipse.

Bang. Hurdle number one. Throughout my college life I haven’t really been a big fan of IDE’s, those editors with a large set of buttons a good deal of which I never click. And even at those rare moments when I used an IDE, I used NetBeans for the reason that Eclipse shares the name of a Twilight installment.

While the adjustments needed are minimal (you still just type on it, you see), I still find it irritating how IDE’s keep telling me I’m doing something wrong even when I’m not yet done with my statement; it’s my little pet peeve, the way they under-jagged-line my code, like MS Word does with wrong grammar. And I never found their autocomplete features smart enough. Well, enough of that.

But the first week is past now and at this point—hear ye, I’m saying this—I’m advising anyone who has the same love for plain text editors as me NEVER to attempt Android development without an IDE. Sure it’s possible but when your app starts to force close a little too frequently for your taste and you are in dire need for a debugger, I’m telling you you’d love your IDE (Eclipse, most likely) like religion.

Android Dev Lesson #1: System.out.println(), the best debugging tool in the world, doesn’t seem to work in the Android SDK environment. In that case, you can use Toast.

And then, they didn’t forbid it explicitly, but I don’t think I’ll have much use for my laptop for this internship. For reasons of company security, work remains at the workplace and we take nothing home save for the experience. And so I’m sitting in front of an awesome desktop workstation loaded with Windows XP.

Workstation at Azeus

Next to Windows 98, XP must be the OS I’ve spent the most time with. Despite my familiarity with it, it’s in times like this that I miss Ubuntu. I can’t help but think that going through the tutorials would’ve been a whole lot easier with CompizConfig’s transparency settings.

With CompizConfig, I could have  something like this (so yes, I have a fresh set-up of Eclipse on my Linux box right now)

CompizConfig Transparency

See what I mean when I said that things could’ve been a whole lot easier?

(A little addendum to my IDE rants above: on my freshly set-up Eclipse, pictured above, I can’t even create a simple Java project. I wonder why?)

Lastly, I took sometime off the first week adjusting to the large keyboard of my workstation. It’s a little frustrating, having all this muscle memory of a laptop’s keyboard make all those one-letter-off-the-right/left mistakes on a desktop’s. But well, as of now, I’m pretty adjusted.

Double, triple, tenfold checked. No company secrets revealed. Right. Hit “Publish”.

Up next, the three days of week two…