Accion International is a nonprofit organization that supports microfinance institutions in their work to provide financial services to low-income clients. As Accion underwent a rebranding, they called on us to interpret, evolve, and apply that brand to their new site. Our first composition was a more literal translation of their identity, serving as a natural outgrowth of their print materials. As an alternative, we took their brand essence in a direction that contextualized their clients’ stories by using their country of origin as a backdrop for the website. Both designs gave Accion the chance to play up their global impact, and personal touch, in new and interesting ways.
Best Doctors is a Boston based company that helps people make medical decisions with access to world-class medical experts. The strong angles of this design are juxtaposed with warm patient photography and add a human element to the page. The four stories are designed on a grid and are interchangeable and rolling over the smaller black and white images will bring them to color and reveal their quote and a link to their story. The action item to Learn More about Best Doctors stands out in a vibrant orange, a complimentary accent color we have introduced to the palette. The Why, What and Who questions stand out on a clean light background followed by 3 action buttons to lead the user into the site. The mega footer frames the site at the bottom and creates a strong contrast with the rest of the content. Overall this design is crisp, powerful, and modern.
Cybex International is a fitness equipment manufacturer for commercial and consumer use. Cybex is a well known and well defined brand within the fitness community. Its web presence had begun to lag by the time they got in touch with us for a new site. The solution we provided them with unlocked the potential of their strong organizational identity, leveraging clean lines, strong typography, and impactful imagery. These elements, combined with a more intuitive site structure, gave Cybex a site that plays to their strengths.
Finagle a Bagel is a family-run bakery that services Boston area retail locations, as well as Grocery and Club Store partners around the country. Comp B has a rustic look to it, with various elements that give the page a three dimensional and immersive feel. The background is a key part of this, with its burlap texture and bagels framing the entire site. The main message gives a high-level introduction to Finagle, in a comparatively larger space than the other comps. This serves this design particularly well, since it breaks up the collage layout with a bit of breathing room. The remaining callouts sit on top of one another, drilling down from the seasonal promotions to the fandom bucket. The social icons continue the natural look of the site, which ultimately gives Finagle a warm and welcoming appearance.
Comp C has a decidedly bold look, complete with a high-contrast color scheme, and a main message that spans the whole width of the page. The background emulates the walls of Finagle’s café locations, with the patterned watermarks of the bagel bite logo. Even the curved top and bottom edges of the main content take its cues from the roundness of the logo. The main message acts as a storefront with big, bold typography and impactful imagery, which can target consumers just as easily as wholesalers and buyers. The callouts below are also image-based, sized according to importance. The café look of the page is made complete with the canned social icons just above the footer. This design is both fun and professional, elevating Finagle’s brand in the user’s eye.
Comp C presents the user with a different approach to consuming content. As illustrated by the key at the left of the page, all articles are contextualized within a specific industry or focus. Clicking on any of these icons in the key will rearrange the main content to focus on the chosen industry. Furthermore, these icons utilize and advance the Foley color palette, and can be leveraged more on the subpages that they relate to. Overall this design is dynamic and inviting.
Harvard Business Publishing is a not-for-profit subsidiary of Harvard University that uses its publishing platforms to influence real-world change by maximizing the reach and impact of its ideas. Emphasis is given to the Harvard red by way of the full color logo and vibrant navigation. The main message is comparatively vertical, with the first slide intended to catch the user’s attention and guide their eye right over to the key message. The buckets are stacked vertically on the right, accented with red, and help users drill down to the more specific information at the bottom. This design is elegant and succinct, giving Harvard Business Publishing a clear and impactful online presence.
The Proceedings of the National Academy of Sciences of the United States of America, usually referred to as PNAS, is the official journal of the United States National Academy of Sciences (NAS). Comp B makes use of the same basic layout as A, but with a different tone. With the thin typeface and glowing header, this design has a decidedly modern edge. The cover of the current issue is aligned with the header, giving a subtle representation of the end product without being literal. The header color, along with the sidebar tabs and divider lines, conveys the color of the given year. As such, the knocked out logo will remain unchanged. The body copy is clean and open, and will be similarly styled for interior content. Sidebar callouts are broken up by the colored tabs, as well as by small icons relating to each topic. This design as a serious, modern, and conservative tone without being stodgy or dated.
The YMCA of the North Shore is an affiliate of YMCA worldwide. Evolves the brand further, by integrating not only the rounded corners of the logo, by the diagonal slant of the Y as well. The navigation appears as a natural extension of the logo. The page is segmented into three primary areas, with the introduction, utility, and supportive content. Main imagery is given new dimension, adding depth the overall design.
The School for Field Studies (SFS) is the USA's oldest and largest undergraduate environmental study abroad program. When they came to my company looking for a new website, they wanted to give their users an inspiring and immersive look at the program. Unfortunately, a change in management caused the project to stall, and the redesign eventually went to another firm. A few months passed, and just as I was cleaning up my design to include in my portfolio, I took a look at what finally went live. When I saw their new site, I realized what they had wanted all along. So I took that as a challenge to push my design even further, incorporating all the best elements from every iteration. What you see here is the end result.
Thredd Outfitters is a clothing brand specializing in surfing and winter sports. That's the basic premise I ran with on this one. Thredd is part of a series of designs I created to add new flavor to otherwise dry concepts I had previously created. This particular design began as a mock-up for a financial advising company. They opted to go in another direction, so I evolved the basic design and turned it into something a lot more fun.
NextGen Games, Inc. is an American developer, marketer, publisher, and distributor of video games. Founded and incorporated on May 28, 2002, the company has quickly become a contender in the home computer games industry. …Nah, I’m pulling yer leg. I made up NextGen games just so I could design a gaming website. Pretty sweet, huh? It’s a dramatic revamp of one of my older projects, a forgotten gem passed over by a tiny software company in the northeast. The main appeal of the design was the wrap-around messaging area. I had fun with this one, for sure. I remember once telling a client, the easiest way to make a website look cool is to make it black. And there you have it.
Melted Crash is an alt rock band from Berkeley, California. Or they could be. But they’re not. Yep, this one of my "imaginary" designs, a remix of an older project. The main goal with this one was to create a homepage that didn’t consist of a main image and three or four buckets below it. So I used the main image as the focal point, with content serving as an accent. This was also a good excuse to throw around a bunch of grungy/indie fonts, which I almost never get to use in my day job (scratch “almost”).
The design for Imaginary Comics started out as an unsolicited redesign of Spawn.com. Go ahead and pop over there right now. I’ve been a huge fan of McFarlane Productions for years, and thought it’d be fun to give their site a refresh without actually changing any content. However, the idea of an unsolicited redesign is a somewhat dangerous one. It’s easy to overstep your bounds, and make decisions that aren’t necessarily in line with the company’s overall vision. I didn’t want to seem presumptuous, so I genericized the content, and created an imaginary brand. I like to think of Imaginary Comics as being something akin to Dark Horse, or a kind of a gritty offshoot of one of the bigger companies out there. Imagine that.
International Data Group (IDG) is a technology media, research, event management, and venture capital organization. What you see here is one of the three compositions we showed to the client. I felt like this design really captured the professionalism and scope of their organization, with clean and minimal design elements and an expansive main messaging area. Classy. Real classy.
Apex Films LLC (formerly Apex Films LP) is an independent film studio headquartered in Santa Monica, California with international offices in London. Just kidding. This site is actually part of my remix editions, but it's not too far from where it began. The initial design was for a film production company owned by a pretty substantial Catholic organization. The content was a little dull, so I reimagined the site as if it were for a company that likes solid action and high drama as much as I do. I kept the basic design elements the same as before, but changed the imagery and sharpened up details here and there. It's amazing what dramatic imagery can do to a design.
BI Ping Pong
Sometime in early 2011, my boss decided to buy a ping pong table for the office. Some of the developers would stay late and work on their game. By the time the summer rolled around, my curiosity got the better of me, and I posted the top ten players on a bulletin board next to the table, based on a consensus of the regular players. Suddenly, half the office got involved, trying to move up in the ranking. My CTO took it to a whole other level, and developed an iPad app which gave everyone a power score to determine their rank. This is the design I came up with for the app. So now, the iPad sits perched on its charger right next to the ping pong table, waiting for the newest scores.
So why am I not on the list? I'm a pool player.
The design for Aero Automotive, a fictitious car company, is the evolution of a project I began for another client. In my day job, I created a design for a life insurance company by the name of Financial Architect Partners. The design had a clean, elegant look to it, and I wanted to see how it would hold up when applied to another industry entirely. Choosing a high-end car manufacturer, I replaced the imagery and copy as appropriate, and refined the layout to what you see here. The simple design brings the dynamic imagery to the fore, and the entire piece is given a sense of depth and movement with the large shapes wrapping behind the main image.
This project was a bit of a fire drill, as another designer and I were tasked with creating a mobile version of the BI website in a few hours. The result was elegant and clean, melding the iPhone design with our own corporate identity.
Unidine is a dining and food management company that was in need of a new look. Their website was a little on the retro side, and they wanted something a little more modern and professional. Thankfully, they had some great images to choose from, and the design came together effortlessly.
Stratus Technologies was a great project to work on, mainly because the client trusted me with just about every design decision I made. When I presented this composition to them, they instantly got it, and were very appreciative of all the subtle design elements I used. The main image is impactful without being too flashy, and really serves to boil down what the company provides its customers in one simple graphic. Also, the dark colors used in the main messaging serves to emphasize the yellow and blue accent colors, and draw the eye to those points. This composition is pure class, and pure character.
This site was later recognized as a 2010 Official Honoree by The Webby Awards.
The redesign of my webcomic site was a huge undertaking that really tested my technical expertise. I took every usability lesson I had ever learned, and applied them to the new design. I also had to learn how to modify a WordPress theme known as ComicPress to create something that conformed to my vision. The site has a wide range of extras that make user interaction effortless, along with navigation that is intuitive and accessible. Best of all, the integration of WordPress makes it easy for me to upload new comics, and give the fans what they want.
The new design for the Boston Interactive blog was a pet project of mine, which I worked on between client projects at work. I wanted to create something that was more in line with modern design blogs, Smashing Magazine being chief among them. The idea here was to break up text with large, eye-catching typography, color variation, and an image for every article. The project hit a slight snag when the blog title went through a few iterations, but it really came together nicely.
The PJ Library is one of a family of sites that my company created for the Harold Grinspoon Foundation. The PJ Library is one of their key programs, giving books to children between ages 6 months to 8 years. As such, the design had to speak to parents and children alike, and convey a light-hearted and playful tone. This was one of those rare opportunities to create something totally unconventional and unrestrained.
Anyone who lives in the Boston area has probably seen the big purple trucks of Gentle Giant movers. They came to my company looking for a much needed redesign of their site, but they didn’t want anything too showy; they wanted something more down-to-earth. So what did I do? I grunged it up. It made sense to me that a moving company’s website be packaged like a shipping box. I’m very satisfied with the result.
Save the Harbor was an interesting design opportunity for the team at Boston Interactive. With the company approaching its ten year anniversary, it was decided that one feature of the celebration would be a public contest between three different design compositions. As such, three designers, myself included, created unique designs for a non-profit organization known as Save the Harbor/Save the Bay. What you see to the left is my contribution to the contest.
On the night of Boston Interactive’s tenth anniversary party, this design was announced as the contest winner.
Destructive Fiction was a site that featured four different webserials I had written over the years. Two years after its debut, I gave the site a whole new look, and a much more interesting homepage that featured the main characters from each storyline. I made use of a very nice CSS trick to make three of the main images blur when you hover over any one of them. Try it out.