This was a project a loooong time in the making — redesigning the main DPT site. It spanned months and months and months, in between client work and experimenting with various emerging web technologies and such. That, and it’s true that you are your own biggest (and worst) critic!

It’s been live (beta-ish) for a few weeks but here it is:

We wanted to stay true to our brand but yet progressive in utilizing some new HTML5/CSS3 elements and jQuery interactions as well as present in an organized, structured fashion. Also, we gave some more thought to SEO, marketing and other best practices.

Another highlight of this project was… going mobile! With smart phone and tablet browsing becoming all the more prevalent, the web community has been striving to make their sites compatible with these devices. There’s still quite a debate going on between building a responsive site that will adapt to different viewports or building completely separate mobile sites. For us, we decided to give jQuery Mobile a try and developed the mobile version of the DPT site with that framework (plus another JQ plug-in for the gallery).

Try the site on your phone:

Learning new stuff is great but we’re glad we can finally deem the site complete. For a throwback now and then, here’s DPT Old School: The Original. :)

And lastly, can’t forget to wish our geeky durian dude happy birthday. We’ll celebrate later this month with one of his if-I-could-quit-my-daynight-job (and papaya-crazed “boss”, ha!) pursuits: braving very, very tall mountains.

Admittedly, it was a tad (or more) intimidating taking on a project for a usability company. User experience is a key factor to take into account when designing websites. Part of the challenge of site development is the fine balance between aesthetics, functionality and usability all the while communicating content in a clear and compelling way. (And throw in things like browser compatibility and constantly changing technologies and you’ve got the perfect storm!). But exactly that… that is what moves us and drives us…

Usability Sciences needed a redesign of their widely read blog. The requested framework was WordPress for its ease of use in writing and posting by the authors. The team already had an idea of the desired layout with a section for featured articles and then posts divided by categories. Overall, they wanted a very clean and professional look while being a “distant cousin” to their main site. In effect, it needed to be, well, highly usable where nothing would distract from the content. Without going into a full-scale identity campaign, a logo besides simple HTML text was also on their wish list.

Usability.com’s new site:

It was definitely a sigh of relief when the marketing manager let us know they loved how it turned out. :) And as always, it’s a plus working with decisive and responsive people on the client side, contributing significantly to a successful project.

Here’s a post with some colors to match the season…

PepsiCo came to us needing a departmental logo and an icon identity system to match several business units within their particular “Center of Excellence” department. Logo requirements had quite a few things going on: department name, abbreviation, PepsiCo name, optionally their mantra of “lead, activate, measure”, colors within their corporate palette and an “e” to look a specific way. Part (a big part, we soon realized) of the challenge was to incorporate these pieces clearly yet in a very uncluttered and cleanly cohesive mark.

Here were some initial concepts:

After quite a few iterative rounds delving thoroughly into placement, type case, type, whitespace, hues, and shades, we arrived at the final logo:

For the set of icons to go along with the branding initiative, we explored a range of possibilities for the graphic itself, giving different options for each business unit as well as the overall icon style from borders to shape to gradients to shadows to glassy to etched (and more). Working closely with the client, the experimentations eventually evolved into their new identity system, which included a large and small icon per unit with utilization based on medium (print, web/digital, screen) and need:

So whee for happy colors… And Happy Friday, Spring & Easter! :)

It’s really been a crazy quarter but nothing short of thrilling… :)

The last month or so has been major crunch time for a proof of concept one of our clients had been planning to take to SXSW. Pocket Piggy is the brainchild of two young professionals who came to us with a clever business idea and a pig illustration (created by a friend) for their mascot. They were needing design work followed by integration to a backend being developed by their tech guys.

We have been (are?) coding away, for awhile through two time zones (with Y overseas), then as the PP team was driving to Austin and throughout their conference… and now, still coding, coding, coding. Y has been deep in Django, Python, Ajax and JS to integrate G’s front-end design/code with their backend and G trying to enforce style and look & feel as development unfolds. This close to beta… hopefully?

So as we await the rollout announcement, we leave you with a teaser…

Their PP pig:

As requested by Jennie, one of the founders, we toyed with the illustration as a logo, experimenting with typefaces and placement but also presented a more abstract concept which they ultimately adopted as their identity:

‘Til PP V.1, keep the guesses going on exactly what IS Pocket Piggy? ;-P We’ve also been pretty busy with a few internal applications/services for some large corporations. Shifting gears a little but happily coasting along.

Working in collaboration with the marketing team and a print/graphic designer, we rolled out the First Rate Performance Conference ‘12 microsite for informational, promotional and registration purposes.

Interesting factoids about this little site:
- The underlying CSS/framework is almost synonymous as last year’s conference site. As web designers and developers know, the power of CSS allows complete separation of content with style so we can essentially build sites that are vastly different visually from a single basic CSS layout.
- With the handy dandiness of jQuery, we were able to create the timer/countdown in the upper right but with a custom look and feel to match the graphics and style of the overall campaign.
- Love you, Google Web Fonts! The possibility of beautiful web typography has evolved dramatically in the last couple of years, thanks to open source foundries like Google’s (with a collection that is impressively growing and growing). Trivia question: How many and which Google fonts are used here? (And of course, we appreciate and utilize @font-face, too, when an exact typeface needs to be matched and absolutely no other web-safe one will do! ;-P No need this time, though.)

Last year’s conference was apparently a great success so here’s to another banner year!