Rebooting the University of Baguio Science High School website (v3.5)

Website redesigns have always fascinated me. “Modernizing” an old tabled-HTML design into a standards-compliant website is both an opportunity to design something fresh AND a test of patience when it comes to retaining the identity of the client. Sadly, I’ve seen some website reboots that may have created a brand-new online experience like never seen before, but also consequently muddied the original identity of the website. This, of course, would be trivial if we were just designing for our personal blogs and portfolios.

The unique challenge with the UB Science High School website was it already had an award-winning design that I made about 18 months ago. In fact, the site has been featured in almost all the CSS design galleries that I know of, counting by the number of hits we get from those sites; it’s been one of the web’s most popular high school websites. The site was also a Finalist at the 10th Philippine Web Awards in the Schools Category. Version 3.0 of the design I made in early 2007 sported a prominent horizontal red gradient with a white header and gold-yellow highlights. The front page randomly presented the visitor with the top-performing students/alumni with a “verb” accompanying each featured person, depending on his or her achievements. So significant was this “Verb Campaign”, originally conceptualized exclusively for the website, that it eventually affected all the school’s ad campaigns for the next 18 months… even the school paper!

The “Version 3.0” really didn’t have many problems, it was easy to maintain and the design was unique but simple enough to make it design-worthy for a couple of years. And like most other easy-to-navigate sites, simplified tabbed navigation made site-wide browsing generally painless. One issue kept cropping up though; the sub-navigation of inside pages seemed to baffle the non-internet-savvy, most notably the parents! The sub-navigation for the main sections of the site was simple text links at the right side of the main content. It was gold when the current page was selected, or gray when just a hyperlink. Apparently this arrangement wasn’t obvious enough for noobies. Every now and then I would get an email asking about information which was already on the website, and I always replied back with a direct link to the page they needed and some minor scolding. I tried different styles of menu navigation for that area but it just didn’t seem to fit well with the overall look of the site. The conspiracy theory I’ve been playing with is that Windows users aren’t “oriented” properly with all their desktop icons on the left-side, having the menu on the right probably baffled them (Mac users have the icons on the right side… which is the right side, since the Mac OS did come before Windows). I guess in this case function-follows-form.

We made plans to join this year’s 11th Philippine Web Awards after last year’s disappointing defeat to Enderun College’s non-compliant website. It was also a chance to reboot the Science High website and play around with concepts.

I’ve grown tired of the red in all the designs I’ve created for the Science High School, I couldn’t help it, IT WAS the school’s colors; Red, Gray and White. I’ve dreaded using Gray since I felt it would make the site dreary and lifeless… and even remind old-timers of Netscape’s default background color back in the day. White was out of the question as it was too common nowadays. After surfing through some sites, I ignored my apprehension and went ahead to use Gray as the primary color for the redesign.

Plain Gray (usually 50% of pure black) is just plain ugly if used improperly, not to mention hard to match colors with. The solution it seemed, if Gray was to become the primary color, is to use a gradient of dark Grays with the darkest almost set to Black. The new site now sports the vertical gradient with a steep darkness change midway, placed in such a way as to create the effect of a darkened room with gray floors and dark gray walls. Honoring the previous design, I just used a white background for the content areas with text. The upside to using Gray was it made the colors standout more than it would normally do if placed on another color. Instead of gold, bright Red is now used as the highlight color. The tabbed navigation has given way to simple text links at the upper right corner.

Less is more, and true to my design philosophy any unneeded design embellishments have been banished. Probably the only “borloloy” (a penchant of Filipino designers) left is the colorful photograph at the top of the content areas.

Overall, I’m quite happy with the new design; even though it isn’t as loud as the old one it’s a bit more straightforward. Hopefully the relocated sub-menu navigation on the left side shouldn’t confuse noobs anymore.

I hope you like it!

Baguio Centennial Logo plagiarized!

A person named Yogesh Darge, based in Mumbai, India, has just plagiarized the logo I created for the Baguio Centennial 2009. The final version of the logo can be seen above.

Here is his Flickr page and the website of his “professional” Design-Studio.

Ay naku these plagiarists!

++++++++++++++++++++++++

UPDATE: 16 January 2008

I sent one warning FlickrMail and a Cease and Desist Order via eMail.

The plagiarist has so far removed the butterfly logo from most of the branding on his website, although the favicon is still the same copied logo based on this one.

The photos/graphics on his Flickr page are also now hidden (not deleted)… but his avatar is still the same plagiarized logo.

Whoever you are, if you want to make it big in the design industry you’ll have to be incredibly ORIGINAL and IMAGINATIVE. You can probably use somebody else’s work as INSPIRATION but never as a stencil for your own work.

Bad karma, bad karma, bad karma to you.

My Broken City

Since a child, I’ve always remembered Baguio City to be a breezy mountain town with quiet streets, pine-scented air in the cold months, and plenty of trees on the hillsides. Spending a weekend afternoon searching for the biggest pinecones at the former American Airbase of Camp John Hay was always a welcome treat. That was Baguio, circa 1983. Things have changed, really changed.

Progress has brought several new developments since I was in primary school. Baguio now has several fastfood outlets, banks, hotels, schools, and we mustn’t forget… the malls and shopping centers.

Much have been said and written about these developments and how they have contributed to the progress of Baguio as a commercial and educational center… and even more have been said and written about how these same developments are turning the once pine-choked hills of the City into concrete forests. While it may be easy to point the finger at big corporations, like SM Malls and Fil-Estate/Camp John Hay, it’s the smaller developments that are making more of an impact on our environment. 

The “big builders” aren’t the main problem.

Near where I live across the Baguio General Hospital and beside the controversial BGH flyover, a hillside with at least 20 pine trees - each probably at least 50 years old - is being excavated for a new building. On the other side of the ridge where the General Hospital is situated, one can find Balsigan and San Vicente, two areas of the city where wanton cutting of trees is done for the sake of making houses. Almost every square inch of this area is built-up with galvanized-iron shanties and ill-designed concrete apartments. The place reeks of sewage, the hillside unable to cope with the high-density population. There is not a tree in sight.

The same thing can be found in almost every corner of Baguio City: Trancoville, Brookside, Aurora Hill, Quirino Hill, Quezon Hill, San Luis, Pacdal, Quarry, Hillside… in practically every major residential area in Baguio the story is the same, houses first before environment. Even the activists who regularly complain about deforestation by the big corporations live in houses that don’t even have a tree in the yard.

While it may be sad to see the trees go, it’s even sadder to think that migrants who build these homes in the City, hoping to get a job in one of them fancy malls, find themselves unemployed since most don’t qualify for minimum-wage positions. A large proportion of students from the lowlands, who study here for college, find it hard to leave the cool temperature of Baguio and decide to stay. Most of them get jobs that might otherwise go to native Baguio residents. These are the people who build the houses on every vacant lot they can find, or at least fuel the demand for building even more houses everywhere.

This is the reality of Baguio now, and I’m afraid to think of how much more change the City will undergo in the next 10 to 20 years. It’s a vicious cycle of building houses that allow more people to move in and build even more! At the pace were going, the future doesn’t look good - Baguio will just be another typical mismanaged Filipino city, devoid of trees and open spaces.

This is my fear… the fact that nobody here really cares anymore.

:’(

Philippine National Police - Criminal Investigation and Detection Group’s THE QUEST 55 Magazine, finally done!

After a couple of delays the Philippine National Police - Criminal Investigation & Detection Group’s magazine is finally out! “The Quest” is published as part of the 55th Anniversary Celebrations of the PNP-CIDG.

This was a rather interesting project to work on as it is the first time I’ve made any publication that really didn’t have ‘real’ photos. Thank goodness for the Stck.Xchng! The challenge was how to create enough space for ‘artistic’ embellishments in the mostly text-heavy articles. Time constraints and other projects that coincided with it’s creation also kinda dampened my brain. Consequently, I’m not entirely happy with it design-wise as it normally takes me 3 to 4 revisions before I feel any sense of contentment - that point in the design process where you can no longer put anything in OR take anything out. In this case, I only had one… and on some pages, none at all.

Maryanne Moll, the project’s Editor and Manager, assures me everything is great and they (CIDG) are quite pleased with it.

I am really not sure.

Design skew is towards white, grunge font for that ‘urban’ look, and those bright yellow “Police Line” tapes as accent. Whole publication was made on three separate Macs running OS 9 to Leopard, InDesign CS & CS3, and a PC in the office for downloading a cascade of eMails.