Saturday, February 11, 2012

Beyond 960

In the typical discourse of our evolving interactive design field, I hear a lot about the 960 grid. In a recent attempt to adhere to this framework with a very ambitious responsive web design project, I realized it fails to address a still very important space: the widescreen laptop and desktop, most often beyond the dimensions of 1024 pixels wide.

85 percent? That's like, the poor people, right?
I have, more often than not, seen the screen real estate beyond 960 treated as dead space with very little thought. Usually I see a solid color or a repeating background extended over it with the boundaries of the framework preventing any further utility. The 960.gs site itself makes little attempt to acknowledge this space, but is it that insignificant? Should we herald the dawn of the 1024x768 tablet dimension as the end-all of our screen-width and height optimization efforts?

In fact, the case is the exact opposite. At least for now: According to W3 Schools, the most popular screen widths are beyond 960, beyond 1024, and have been increasing steadily over the years with one exception: 2011, which saw the rise of tablet computing and specifically the iPad. However, according to the statistics in the above-cited link, 85 percent of the W3S demographic remains a considerable majority when deciding what our canvas dimensions are for any given interactive design project.

Within the interactive world, responsive design has leapt to the forefront of our passion. We eagerly go to websites like bostonglobe.com and scale in our browser windows to witness with awe the magic of responsive style-sheet substitution, at least for myself and my geeky colleagues at Brown Bag. An entire slew of responsive templates have arisen in a very short amount of time, and yet very few have given any thought to the idea of optimization, utility, and aesthetics outside of the 960 grid space.

Me gusta.
There's also something else affecting the premature abandonment of the widescreen dimension: the switch to the mobile-first design methodology. Now mind you, I'm a huge fan of this school of thought, usually attributed to Luke Wroblewski. In the long forgotten past (i.e., a year ago), before mobile-first, those of us working in the responsive space would come upon uncomfortable in-between states where elements of a given design simply wouldn't cooperate. There would be too much horizontal space for two columns, but not enough for a third, and this state used to be the tablet space. Things started with a desktop design, then a complementary mobile design was added, and the nascent tablet space had to deal with that wonky two-column spread that was too far apart.

As we move towards mobile-first design methodologies, the tablet is less of the uncomfortable in-between space. The choice is instead made to alienate the more popular widescreen desktop, creating large aspect ratio "gutters" on the left and right side reminiscent of 4:3 content on a widescreen, 16:9 TV. In an aesthetic sense, this is still a far better place to be. But unlike TV, we can actually do something with this extraneous area of often 300 pixels or more on each side. We're interactive designers and the web remains our creative, exploratory space. Where the tablet was our undiscovered country, the widescreen desktop and laptop space is our forgotten land, rich with untapped utility and creative opportunities.

Facebook brings ancillary utility to the widescreen gutter.
In fact, at least Facebook is utilizing the widescreen gutter the right way. Stretched out beyond 960, we find our friends' latest activity and an extension of the chat utility. One finds that the gutter is ideal for support content; i.e., things not necessary essential to the core experience and done away with when brought to the tablet and mobile level. Facebook, to this degree, has a pseudo-responsive nature that comes from treating itself like an application more so than a website following a responsive fad. It does what works, and explores ways in which to enhance the user experience for its specific audience.
 
And on that note, I would like to encourage getting off the responsive bandwagon purely as a cosmetic exercise that benefits developers by not having to create multiple sites. In the end it's about the user, and smart design is concerned with the much larger picture of enhancing the user experience. Screen real estate is only one of the factors in the larger-picture approach that brings greater value to consuming content on the web. Let's not waste those precious pixels! Despite the rise of the mobile and tablet spaces, responsive design can and should exist beyond the world of 960 pixel wide screen sizes. Statistically there remains a huge audience for it.

Sunday, November 20, 2011

Changes

According to this Onward Search infographic, Atlanta is one of the top three destinations for what I do. I've brushed shoulders with San Fran, Austin and a few other destinations where the UI/UX job market tends to thrive and I'm surprised over the Atlanta mention. Apparently I shouldn't be. And for some reason, Atlanta feels like a brand new city to me given this fact. Taking a year to decompress in Hilton Head was exactly what I needed to get away from the hustle bustle of the city, get my bearings, and come back in strong with a new perspective.

Brown Bag Marketing is a fun, up-and-coming group in a very elegant and creative space at the heart of Buckhead, Atlanta. Every name has a scope, and one can see immediately that the culture at BBM is humble, down to earth, and fun. No Big Evil Corporation here, just a company that feels great to work at and has great client relationships, primarily in the financial and pharmaceutical sectors. It was after much deliberation and several candidate options that BBM chose me to come on board and be their sole art director on the interactive side. Thank you guys. It's a considerable responsibility and one I'm more than prepared for given my experience in this business. There's not a lot of positive career progress going on right now given the economy. But of course Internet related jobs remain more resilient, as are several of the industries that BBM is in the business of servicing.

I also want to focus for a second on the BFGi guys and all the inspiration Brendan LaMarsche has given me as I take on more responsibility. The Sr. Designer role at BFGi came with a heavy focus on coding after the departure of a Flash developer. Because of that "trial by fire" experience I grew by leaps and bounds, and it was delving into the world of OOP and programing concepts that qualified me for the Sr. Interactive Art Director role I've taken now. The interactive field truly is a "both sides of the brain" sport and I wouldn't feel comfortable with such a title if it weren't for the year I spent working with the crack dev team at BFGi, coding for everything from large portal sites to responsive web/mobile/pad microsites, and as of late even iPhone and Android apps.

It feels great to come to work every day, and no less into a space that is premium and creatively inspiring on so many levels. It's exciting to think what the future holds for this fast growing company. And to top it off I have a great new living space that feels perfect to come home to after a long and productive day.

Thursday, June 23, 2011

Relaunching Lahiri Studios

Damn it feels good to be a gangsta.
The new (and improved) Lahiri Studios portfolio is live as of June 23rd, although we had a soft launch earlier in the week sans a few analytics features that had to be implemented.

The goal this time around was to develop a portfolio site that was less of a trash heap for everything I've ever done and instead showcase a few choice pieces in categories that I thought were relevant to potential clients. Some endearing example work from my early career days had to get axed, but may return at a future time. The positive side is that I can lay claim to a lot of fresh work that is just as compelling if not more.

I've had a blast messing with the Open Graph protocol that Facebook recently implemented. It essentially allows a site administrator with a Facebook account to treat any page just like a Facebook page, complete with it's own wall, photo section, metrics etc.  That leaves me possibly taking down the old Lahiri Studios Facebook page given the redundancy. What to do?

Another major goal with this relaunch was to incorporate more social media avenues than the current site could squeeze in. I've found linkedIn to be a huge tool in my professional life so I had to add that as well as a feed from this new blog which is turning out to be a lot of fun. Overall I'm hoping clients will get a well rounded picture of who I am as a professional and have everything they need to know at their fingertips with this revamp. Killing the popups and having a more search-indexable site was crucial this time around as well. The lightbox feature is SEO friendly thanks to the fantastic work of my developer Brendan LaMarsche.

Despite this being a portfolio site, I put the branded identity concept on the back burner for a more neutral appearance. This is not a Cargo Collective or Behance-style designer's portfolio. It's not an agency website. It's super diverse and touches on elements of UI/UX, multimedia, art and design, and even some programming. And if someone came along and gave me the opportunity to jump into video games, or mobile apps, or some experimental new technology you've never heard of, I'd hop right on it. I like to have fun, and that's what being in the digital space has afforded for me. I'm proud to have touched a lot of exciting mediums of communication over the years. Some of it is highly entertaining, multimedia ear and eye-candy, while some of it is cut and dry, usability-minded work that is challenging and engaging in it's own right. I feel like the site had to remain neutral in tone for this reason.

I continue to adhere to the belief that minimalism is the key to good information design. Years of rock star projects where I'd work with teams seeking to push the multimedia envelope has rekindled a love for simple and responsive UI design. UI/UX projects are one of my favorite lines of work, and are often just as engaging and challenging as the crazy compositing and vector illustration stuff I've been known for. I've got a few projects in this category under my belt and I've done my best to showcase them in hopes that I'll get more such opportunities. Granted, I love it all. I eat, breath and sleep the arts, and the opportunity to use my Wacom tablet to composite some crazy fantasy world together is always welcome. The Wacom stuff is a meditation that takes me back to my pencil and paper days, where realism was my ultimate goal as an artist.

I do have some thoughts on a fully branded identity using the same portfolio items but that's in the instance that I start my own agency, which I don't have any plans for at the moment. Who knows, maybe someday. It all depends on what destiny has in store for me.

Saturday, April 23, 2011

Absolute Rubbish, Laddie

No I haven't reverted to adolescence, but those who know me personally have seen my profile picture on Facebook change to the image of "Big Mother's All-Seeing Eye" for the time being. Just a quick vector design in Illustrator taken from images projected on the 36-foot high wall of the 2010-2011 Roger Water the Wall Live tour.

The Wall's lowest common denominator appeal is an anthem of adolescent rebellion, and in its timelessness will continue to be so for generations to come. Having seen The Wall in my teenage years and with very little understanding of the deeper underlying themes, the film spoke more to the subconscious intellect and emotional brain first. In so doing it creates an impression that refuses to be shaken from the viewer's memory for just about anyone who sees and hears it, of any race, creed or culture.

The film is anti-fascist in every vein but it's depiction of Nazi-style imagery have left more superficial critics accusing it of the opposite. I won't go into that here, as there is plenty of literature on the matter due to a recent ADL jab taken at the tour's depiction of the Star of David in the Goodbye Blue Sky backdrop. Like all esoteric masterpieces that reach beyond the intellect to impart its message, it remains out of the grasp of face-value judgment. The Wall simply is not what it seems at first glance. Other aspects of the film grow only more apparent with time and age in the life of an individual. What touches me today is the themes of alienation, the relationship between the sexes, the crime of showing feelings as put on trial by the literal "asshole" judge near the end of the film, and the horrific mask of conformity that exists to hide those feelings from the authoritarian figures in our life; those who prey on our humanity, despite the fact that they share that humanity with us.

Photo Credit: Pink Floyd's The Wall Motion Picture
The Wall is a timeless masterpiece written when Waters was 36 years old. I couldn't have been more than five years of age myself when I had first heard the Pink Floyd sound. It happened to be over the radio with Another Brick in the Wall Part II. Who can forget the endearing remarks of the saturnine teacher exclaiming "If you don't eat your meat, you can't have any pudding! How can you have any pudding if you don't eat your meat?!" Since then, the legendary Roger Waters has influenced my musical palate more so than any artist I've known. His work is painstaking musical craft of a profound depth that is increasingly rare in the age of manufactured artists and templated, formulaic compositions; compositions that are bought and sold as commodities with an expiration date. The Wall, as time has proven, has no expiration date. It is immortal both musically and to the extent of it's deep thematic exploration into the psychology of fascism.

Recently Bob Wilson, one of our resident rock and rollers at BFG, described The Wall to me as "art rock" and it seems an appropriate enough categorization. The Wall, however, set a standard that has never been met, nor even remotely followed in music to this day in the category of art rock or otherwise. And why should it be followed? The format of The Wall is appropriate for what it is and what it has to say, and though it tackles many a common theme in rock music past and present, those themes have never been explored as uniquely, nor with the depth to which Waters has gone with his 1979 masterpiece. With many of the walls having come down in the Western world already (sadly to be replaced with less apparent ones raised by our own complacency and slothfulness), the catalyst for such anti-authoritarian passion is non-existent today. Perhaps that will change as conditions in the Western world sour. But anyone who has observed Roger Waters knows that his passion is far from reactionary; it is his cynical nature, and what he creates is from his own essence. It is why The Wall belongs to Mr. Waters, why this performance has been so remarkably genuine, and why it's been a time capsule full of the vigor of a generation of activism long put to bed. Each note in the live performance is more accurate to the film than any live rendition of The Wall in the past, due largely in part to the reverence of Water's extremely talented support band.

A shot of the 36-Foot wall as taken from my iPhone.
Despite the decline of music as a craft, the field of motion graphic design has made huge advances. In that context, technology has only enhanced the presentation of a show and an album that are over 30 years old, to truly bring out the inspirational power of The Wall for those who have the sensitivity to appreciate it. If you're an artist of any sort, you'd have to see this show merely for it's technical excellence. But it rings true in a different way for those of us born and brought up amongst the middle-class, Protestant expectation of an old regime, as it explores the crime of uninhibited self-expression. The regime was as much a part of the creative explosion of British rock and roll as was the music itself, indeed the two coexisted for a time like night and day but the balance is quite upset, in my opinion, and what we have today is mediocrity in the arts due to a lack of structure. The story of the wall today in the Western world is closer to the story of the Pixar film Wall-E.

Regardless, there are several microcosms in my own daily life in which the sentiments of The Wall find their home, as there are for so many others in the world living in conditions where their feelings cannot be expressed, where "she won't let you fly, but she might let you sing." The tour comes at a time where a return to a father/mother figure is sought by many of us in a time of war and economic uncertainty; where control and freedom from control become central topics as a declining superpower takes stock in its military might, where traditional authoritarian conflicts remain in the Mid-East. More of Roger Water's reasons for touring now can be found on the official site here.

"Money get back / I'm all right, Jack / Keep your hands off my stack / New car / Caviar / Four star daydream / Think I'll buy me a football team." Absolute rubbish, laddie.
 

Get on with yer work.

Monday, January 31, 2011

The Birth of a Self-Promotional Campaign


BFG wanted to let potential new hires, clients and potential clients know just how much WE ROCK! so the natural thing to do was reference some classic Spinal Tap and make a simple promotional piece that people could forward on to their friends. It was a two-week creative process and an absolute blast to work on. Here's the play-by-play that led up to the final piece:

Our artist's rendition of the concept
The Mockup
 After some initial brainstorming with writers, art directors, creative directors, programmers and designers, we came up with this crazy idea of a speaker that exploded with all sorts of quirky stuff after hitting 11. The subject matter would be fun, weird little iconic pieces that represented BFG's personality and character, as well as some Internet trends. Art Director Adam Sidwell, our resident sketch artist, came up with this visual.

Designing for Interactive
After receiving this artwork, it fell on myself and a writer to make it come alive on the web and to make it practical for an interactive deliverable set to go out in a matter of only two weeks. We considered things like viewable area, file size, preloading and the realities of pursuing our level of quality with the time challenges we were up against. There was also an email to go out that promoted this piece.
Photoshop and Illustrator work together
in furnishing a "3D rendered" look

We quickly took up the artists concept and started an initial design of it in Photoshop. There was no 3D rendering involved here, just a guy with a Wacom tablet, namely, me. The BFG "look" employs a lot of grunge but Sr. Interactive Art Director Cyril Guichard's strategy was to start clean and apply that later. To the right was the first comp. My directions were to create something as close to a 3D rendered look as possible, and my tools of choice were Photoshop and Illustrator. Notice the two batteries as our power source. Later on that came to change.

The Writing
Behind the scenes Associate Creative Director Alan Whitley was hacking away at the verbiage that would accompany this piece. This was as much his brain child as it was Cyril's, and it had to work. It had to express who we were succinctly. It also had to be done before any design was undertaken, as the copy was to be hand-drawn and scanned in. It's all part of Josh Weston's very organic style which he will go to great lengths to pursue, and for which I've developed a new appreciation. Josh, BTW, is our newly hired Interactive Art Director.

Experimentation and Revisions
As we moved forward with the design, several good ideas came up. We played with the lighting, and ultimately came to a conclusion that we'd go with a lighter background. We also felt like that the original batteries just didn't have the juice we needed to power our fictional contraption, so we bulked it up a little. I then airbrushed in some electricity and added the copy.


Cyril liked where things were going but felt things weren't enough in the BFG "World" which is very stylized, so we flattened the foreground elements, revisited the background and added further filters to really kick it up a notch.We then added the sound waves and CTA. The rainbow and cutout elements were our first take on this idea. But the rainbow came across as too colorful for the tone we were trying to set.We went for something more thematically consistent. Oh, and Beshlevin had to go.

Coding, Animation and Sound Design
This is where I took everything from Photoshop, exported the elements, and made them come to life in Flash with a little bit of code, some timeline animation and a heck of a lot of planning. The preloader also had to be designed and created within Flash. Sound design was also a key component and Hue Hughes, our video and sound engineer, came through like a champ with the appropriate sounds to make the speaker system rumble and finally explode at the end.

Final Approval and Email Push
The entire site implementation and email push couldn't have been done without Brendan Lamarche, our lead Software Development Manager. Brendan works behind the scenes to make sure we are tracking hits to the site, managing the traffic, and pushing our email campaigns out smoothly. Email and word of mouth is really our sole means of driving traffic to this piece, so Cyril designed an email to go out with a little copy "This is the year to really crank it up" and this simple image.Go ahead, click it!

Wednesday, January 26, 2011

New Book: Pious

I have the pleasure of now knowing the answer to that burning question on everyone's mind: "What happens when an interactive designer take a shot at writing a book?" Well, it's a question that I at least had, given the fact that I'm one such designer and have toyed with the idea of writing a novel also. Well here's a guy who did, who actually did, and he's my friend and former co-worker Kenn Bivins.

Several years ago while working at Moxie Interactive of Atlanta, I met Kenn and Shawn Jones, designers like myself, who shared several common bonds. The three of us would go to lunch about every day, more often than not to Atlantic Station, a sprawling retail courtyard always abuzz with activity. Kenn had a penchant for Moe's Southwest Grill. Shawn and I, on the other hand, would do our best to sway him away from the contrived "Welcome to Moe's!" greeting that the servers would mechanically repeat with forced enthusiasm every time we walked in, or were dragged in by the likes of Bivins.

Over the course of nearly three years, Kenn became lovingly nicknamed "Dark Cloud" Kenn, possessed of a justified cynicism that I had only begun to understand as my own life transformed violently with the death of my father and a crushing divorce all within the same year. Our lunch breaks became more of a meeting of 2 1/2 than three, as I reflected into the distance about a life that had gone off the rails of tradition and into the unknown with the separation of myself and my ex-wife. Kenn and Shawn had been through this all before, but at the time there was no light at the end of the tunnel as they had seen, and slowly but surely I grew reclusive and took a new job opportunity elsewhere, trying to physically escape the memories that Atlanta had accumulated. Since then Kenn also moved on, taking up an Art Director position at JWT.

I left Moxie to find a respite for myself, reconnect with family, and pursue my passion for design and technology with Lahiri Studios, and as of late, writing, with this blog. And during that respite I also took up some new reading, particularly, Pious. I always admired Kenn's active life outside of work; where the rest of us were so tied down with our full-time responsibilities and simply making ends meet, Kenn made it a point to have a life outside of work. Beyond the father, the designer and friend, in Pious I had the opportunity to witness Kenn, the writer. And with Pious I learned a little bit more about a person from whom I sought advice and wisdom through some very difficult years.

Kenn has expressed that Pious is a book about forgiveness and redemption, and I would add to this that it is also a book about misunderstandings that can escalate into life-changing events. Something that I am all too familiar with at this point. Looking at the main character's mistakes makes it painfully obvious that our lives are far from within our own grasp, and this can either be celebrated with spontaneity and a sense of adventure, or perpetually lamented for those of us with a fixation on illusory appearances and control. It's a highly recommended read, and that much more enthralling given the fact that it was written by my close friend and a fellow designer.

To learn more about Pious, click here, and check out the Amazon link above.

Tuesday, January 25, 2011

Well It's About Time

I figured I'd start a blog for Lahiri Studios; perhaps a little late given I'm so active on Facebook and Twitter, which have just about become my blogs, but there's no way to monetize those, so I figure why not try to do just that and get some spare change on the side for my deep, brooding thoughts. :-)