Design guides are fantastic to follow – but sometimes rules are meant to be broken

Comments 0 - March 28, 2011 – 11:32 pm

The use of common navigational GUIs are key in showing users how to quickly learn your App.  Apple’s iPhone SDK and visual language are very well defined which makes it that much easier to create effective navigation / user flows.

Given this, I typically use a standard base level tab style. However, a recent project prompted me to challenge my own best practice. The product called for a 2 tab experience, however the standard style looks underwhelming and awkward when limited to only 2 choices. The goal was to play up the product’s simplicity – but the spacial relationships delivered the opposite effect.

The Solution

I created a customized tab style that is visually tied to the standard SDK – yet one that utilizes the full width of the bar.  This is where the standard SDK implementation fell short. However, when occupying the entire space, it plays up the simplicity of the navigation with a strong presence rather then to feel overly simplified due to an awkward spacial relationship.

By marc | Posted in Design, Mobile Interactive | Tagged , | Comments (0)

A Disappointment with a Twist

Comments 0 - January 10, 2011 – 8:34 am

On Sunday, the family hoped to enjoy “25 years of Pixar Animation” – an exhibit at the Oakland museum which had been extended through the weekend due to popular demand. We had only learned it was there on Saturday, so we had felt fortunate to have found out in time to make it to the last day!

So you can imagine just how disappointed we were when we arrived at the museum only to find that it had been sold out and we would not be able to get in.  Pixar always includes an element of the Bay Area into every movie, so in this spirit we drove up to the Berkeley Hills to catch a glimpse of the area that has proved so special to our favorite animation house.

As you can see – our efforts did not disappoint! A short drive up to Grizzly Peak reveals just how special a place the San Francisco Bay Area truly is.  So while we were let down that we could not get into to see the history behind Pixar’s past 25 years, it is easy to see how they could produce such amazing work in place as inspiring as this.

By marc | Posted in Bay Area, Daily Life | Tagged | Comments (0)

A Chilled January Sunrise

Comments 0 - January 5, 2011 – 9:06 am

A perk to my new year’s quest to re wire my internal clock, is in being able to watch the sunrise.  Historically, I have done much of my best work between 10pm – 2am. (I enjoy the silence) However, so far I feel pretty creative in the early morning hours and attribute a bit of this inspiration from the combined silence and changing light.

By marc | Posted in Bay Area, Daily Life | Tagged | Comments (0)

The CBS Interactive Tech & Business team is seeking a full time designer (s) with some chops!

Comments 4 - December 15, 2010 – 7:19 pm

The CBS Interactive Business / Technology group is looking for talented Jr – mid level designer (s). Someone who is looking for a chance to step up and get to work doing his or her best stuff yet. This person is a team player that lives and breathe new media and the interactive space – Someone whose work has been seen in or aspires to be seen in some of the designer showcase sites. (CSSMania, TheBestDesigns, Creattica, Dribbble etc…)

About the gig~

This is a full time position – The successful candidate (s) will assist in the creation of design solutions for assigned web projects including: product redesigns, new page layouts, visual interface design systems and functional | interactive elements, e-newsletters, promotions, and other graphical needs. Looking to the not so distant future, it will move beyond the desktop web and explore possibilities with emerging platforms such as mobile & tablets.

We are a tight knit design group that works closely with the Tech Production team to insure quick delivery of cutting edge design solutions to our audience. You are an avid user of web tools, applications and shared content online. You have understanding and interest in emerging web technologies, concepts, and designs. You pay attention to what others are doing with current design, and THRIVE on adding “best of” skills and techniques to your bag of tricks. The perfect candidate will have a solid understanding of user experience, be preoccupied with usability and have a great eye for the small details that make design stand out from the crowd. You will help define new site sections, concepts, and user flow.

The Requirements

  • Portfolio of work that indicates an understanding of current web design trends
  • Must be a self-starter who can produce top-quality work on tight deadlines for multiple internal customers and product teams
  • Approach design with user-centered design methodologies and practices
  • Understand the role of design in creating usable and effective web / digital interfaces
  • Able to conceptualize and design innovative user interfaces for consumer- facing websites and web-based applications.
  • Excellent communication and organizational skills. Ability to present and support creative concepts in a professional and engaging manner
  • Strong desire to learn, grow and be a part of a passionate group – whose desire is to do the best work of their career.
  • Advanced knowledge of the full Adobe web Creative Web Suite.
  • Experience with valid HTML & CSS
  • Current and review-ready portfolio

All seems reasonable right? Most important – you have to have an online portfolio. I’m not interested in a resume of what you’ve done, and where you have been. Let your work knock my socks off. If you have the chops… you are that person, or know of that person… I want to hear from you!

By marc | Posted in Bay Area, Design, Work Related | Tagged , | Comments (4)

A December Sunset in Northern California – The sky is on fire~

Comments 0 - December 11, 2010 – 10:18 pm

The past week has had it’s share of stresses for me. However, my mantra has always been that the most beautiful things in life are so -  with or without us. That said, it is up to me to see and notice those things that are so easily overlooked or taken for granted. As my family headed out the door to go out and grab some dinner, I could not help but notice that the sky seemed to be on fire just over the hill from my front deck.

Ten minutes well spent…

My instinct was to run up the road to go have a look, and I am so glad that I did. As I ran up the street that runs parallel to me, you can see the vista that greeted my last minute pre-dinner effort!

As I came to the top of the street – my hope was to get above the silhouette of the homes to get a higher horizon line on the fiery sky that was about to disappear behind the mountains to my south west. To do this, I quickly hiked to the top of an open space ridge just to the right of the sidewalk.

As you can see – my efforts were rewarded greatly. All together, this took me less then 10 minutes – However, the act of making the choice to actually see this beautiful sunset that was happening weather I noticed or not brought a new and fresh outlook to my mood and spirit.  Life is a collection of moments… and we do have more control then we give our selves credits to determine how we spend them, and what we are able to take from these opportunities.

By marc | Posted in Bay Area, Daily Life | Tagged , | Comments (0)

A Functional use of New Media!

Comments 2 - September 30, 2010 – 11:44 pm

One of my favorite side projects is one that I have built to showcase the adventures I share with my son Brandon.  Obviously the content is more near and dear to me then any of my other work. However, it functions in a way that really makes the sharing part quick and easy. Thus what ultimately makes it so functional for me. I originally intended on keeping a more standard blog, but never could seem to find the time to write up lengthy post’s about our experiences.

Why make something custom?

I have never been good about updating a photo stream on Flickr and Facebook’s shifting position on my privacy really creeps me out. In the meantime, my friends always joked about how many photo’s I take using my iPhone.  There are over 1600 photo’s on it right now – So it seemed only fitting to make use of the life stream that was taking shape with a device that I already take with me everywhere.

I love the power and simplicity of WordPress and have used it as a platform to create numerous custom site designs & blogs themes over the years. However, this project was the first time that I took advantage of the mobile publishing aspect of the iPhone App. This is what makes this such a powerful way for a proud dad to share. I already use my phone as a means to capture events, it is only a few quick steps to write down a few words that provide some context to the photo.

The one thing you must do from the desktop admin is to turn on the remote publishing blogging client found in the “Writing” section in your settings widget. Next, simply download & install the free WordPress App on to your iPhone or Android device. Once you have installed the app – you simply enter the same log-in you already use to access the desktop wp-Admin into the log-in prompt from your smart phone.

Once it is loaded up, you can see and manage all of your existing posts / comment, or write a new ones. From the Post view, it is quite easy to take a photo or choose from an existing one in your photo library making it simple and quick to document and publish in real time.

A fun component to Brandon’s site is the ability to use the GPS function that is integrated into the iPhone. My dear friend and colleague Brice Lechatellier created a nifty little wp plug-in that allows you to ad and style a Geo location map to each post. He created this to document his whereabouts on a 6 months around the world trip that he recently embarked upon. I find that it adds an interesting bit of context and flavor to the ongoing story of my adventures / life stream.

So there you have it! The design itself is really quite simple – nothing complex or worthy of explanation. However, the straightforward process to both create and consume make it a very pleasurable utility!

By marc | Posted in Blog Skins, Design, Family | Comments (2)

PORT is not only intended for our advertisers – But for our own content and users as well

Comments 1 - September 25, 2010 – 3:02 pm

PORT : Prominence, Ownership, Response and Targeting. These are the key elements by which we measure ourselves as it pertains to being able to deliver value to folks who advertise on the CBS Interactive Business and IS/IT properties.

Our design framework has many key elements that are intended to deliver this. They are built into the very fabric of our properties with the intent that the very goodness that is able to deliver this presence to our advertisers, can also be used to bring attention to our own good content, features and topics. By using the strong presence of the combined Super Leader Board / Mantle skin, we are able to schedule highly targeted feature promotions that direct users into our own sections.

The ability to do this brings enormous advantages – Example:

  • Early in the day, a small group of folks meet to discuss ways to drive traffic to a hot topical image gallery in ZDNet.
  • By mid afternoon a creative has been executed
  • By the end of the day it has been scheduled into our rotation using unsold ad inventory. Our solution is live and seen in various spots throughout ZDNet -  With NO engineering involvement

The beauty of this is in our ability to deploy at a super fast pace – Thus we are able to either succeed or fail quickly. As as result, we can test what will work in real time and modify as needed to find the ways to best move the needle.

By marc | Posted in Ad Innovation, Work Related | Tagged | Comments (1)

Some Old-School Style

Comments 0 - September 24, 2010 – 5:58 pm

Recently, a pal sent me this video put together by the impressive folks at SkateHouse Media. It is such an awesome display of old-school downhill skating drenched with style, speed and a heck of a lot of really cool tricks! Add to this a super fun and lively musical arrangement… and I just had to share!

Enjoy – and be sure to have your volume turned on!

By marc | Posted in Uncategorized | Tagged | Comments (0)

The little things that can help transition from Point A to Point B

Comments 1 - August 25, 2010 – 11:06 pm

On my team, we have spent tremendous amounts of time talking about where we believe advertising is headed within the interactive medium. Bigger and more premium placements are the future. To that end, we have greatly simplified our design frameworks to allow for maximum modularity and flexibility (both for product & Ad innovation)

Our recent redesigns can serve multiple combinations of these prominent ad executions – but not all folks in the industry are prepared to do this. This makes for a big challenge. We can not simply tell folks that we see the future of web advertising – We need to show them what is possible and in doing so they will lead the charge to push the envelop with this new world of options. That said, it is critical that we offer folks opportunities to maximize their legacy assets while they catch up to where the industry and our properties will inevitably allow them to go.

This serves 2 very important goals.

  • We become a genuine partner to our advertisers – showing them that we are committed as a company to delivering a great experience not only to our users, but to the advertiser as well – In this case, not only are we building sites to provide PORT in the future, but delivering this DURING the transition as well
  • Greatly improving our site experience for our users – The very elements that make ad creative feel larger and more prominent, also serve to set more clear boundaries between the host site and ad promotion. The grouping of ad elements are more logical and make the experience more cohesive for both the sponsor message as well as our own editorial narrative.

Take the example below: FedEx

FedEx had sponsored a vendor showcase in the leadership section of the site. The package includes a Leader / skin combination, 300 x 60 companion top clamp, List of contextually related links & a lower MPU. This provides both a brand play, as well as an opportunity to have a shared voice within a section related to the vendor’s message.

The issue: FedEx did not have any skin assets to combine with their older 728 x 90 leader board ad. We have built our new sites to be optimized for a much larger 980 x 150 leader as well as to be combined with a site skin. The 728 is from a bygone era – yet remains a staple of advertisers easily deployed assets. It is an odd size that at best feels out of place in sites optimized for the 1024 x 768 experience.

If a user were to click on any of the drivers on BNET – they are taken to a micro site with the full details of the FedEx Cup campaign. By simply grabbing the background from this site, and sizing to work as one of our Mantle-Skins – we accomplish the criteria mentioned above.

As you can see – the addition of the skin has greatly increased the presence that FedEx has on the site. However, what it has also done, is filled the odd voids on the sides of the small leader board – making what previously felt out of place feel integrated into the larger group. Odd as it may seem, the addition of bigger creative, has removed the scattered nature of these odd sized elements. This leaves the page feeling cleaner with more logical groupings to both the editorial & the sponsorship.

On the surface, one could argue that FedEx was a perfect example that only worked because they had an existing skin at the destination site. However, the same situation can be repeated even when there is no existing assets available to us. In fact, it is easier to integrate .

Example: Charles Schwab

Seen above is an identical “Vendor Solution Center” built for Charles Schwab. Like the FedEx example – it too only has an odd sized 728 x 90 leader board. In this case, we create what we call a “simple skin” which samples colors from either the brand color palette – or colors being used within the existing creative. By using this as a backdrop to the other elements – all the previously odd sized pieces are consolidated into the far stronger unified block with the same effects mentioned above.

In this case, we also added a brand sconce – which places the sponsor’s logo to the sides of the leader with some minor lighting effects for some added depth. Typically we will create 2 versions, one with and another without the addition of the branding. However, we feel that either will work and only provide the two as it seems easier to gain client approval when picking between options.

The summary: These are really easy fixes that require minimal time impacts on even a small creative team – yet the up side to our products and value to our advertisers is significant. I am as eager as all other folks, in wanting to serve newer and better creative on our brands – but am aware that this will not happen overnight. In the meantime, these tricks can turn lemons into lemonade improving our products and making CBSi a “must buy” with our advertisers.

By marc | Posted in Ad Innovation, Work Related | Tagged , | Comments (1)

PORT is Alive and well: making appearances on CBS Interactive brands!

Comments 0 - August 22, 2010 – 9:15 pm

PORT : Prominence, Ownership, Response and Targeting. These are the key elements by which we hope to measure ourselves as it pertains to being able to deliver value to folks who advertise on the CBS Interactive Business and IS/IT properties. This had been a foundational element that drove many of the choices that were made in creating a the new design framework that has now been rolled out first to ZDNet and now to BNET.

Now that ZDNet has been out for a bit, we are starting to see more of these bigger premium implementation being delivered on the site. What has been interesting to watch, is that with each new campaign, the execution of the ad creative is getting better. As the client agencies as well as our internal central design team see these in action – we benefit from THEIR progress in learning new ways to push the envelope within the realm of possibility for these.

I would argue that everybody wins

  • Our pages look cleaner with more premium Advertisements
  • The Advertisers / Content sponsors get better visibility – and or shared voice via the larger presence on our brands
  • The larger the creative – the EASIER it is for the end user to separate what is Host content – vs Ad Promotion

A look at the creative below – shows this PORT in action. Google is running a campaign to promote the benefits of Google Apps. In this case, they have also built it as a Cross Talk – meaning that the animation from the upper leader board art seamlessly and sequentially works with the corresponding Double tall MPU below.

All elements tied together with a matching site skin brings a very cohesive look to the entire experience. I would suggest that it is the strength of this creative that grabs the users attention which increase the likelihood for an end user to engage by clicking the Learn About Apps at Work. When the user engages the unit expands the “push down” to display the deeper body of content / vendor messaging. In this case the user is greeted by multiple video case studies of credible folks explaining the what and how they have depended on the Google app suite.

This is PORT in action. Now granted – this is also very strong ad creative, but it is the combination of these varied pieces that when grouped together become quite cohesive and create an environment where our advertisers can impress us all. While they have done this – our native site branding, navigational infrastructure and content narrative are left intact by blocking out real estate that is intended on being populated by these strong placements. (though I must admit a bit of ironic humor that it has been purchased on Mary-Jo Foley’s Microsoft blog!)

By marc | Posted in Ad Innovation, Work Related | Comments (0)