Category: Product Design

Random Thought- Responsive Web Design (an Analogy)

I thought I’d get this down somewhere, recorded in history before someone else claims they came up with it.

“What is it?” you ask. Once in a while, somehow I come up with clever thoughts and analogies for everyday things. Interestingly enough, someone in the office brought up the subject of responsive design,  and how difficult it is to do well, or at all. My thought and then answer was “Uh, no, it’s not.”

And to be truthful, really, it’s not, or shouldn’t be. Really.

It’s not that I was being cocky, or arrogant, or too sure of myself. I just feel deep down inside that people make a big deal a lot of times about things that are really quite simple, if you take the time to really look at them from a less-cluttered mind. Or even from the eyes of a child. I’m not saying one should be childish and immature. That gets you nowhere fast. But as designers, we need to be child-like at times – seeing things with wonderment and simplicity.

That afternoon I had an interview with a local creative agency to do some UX contract work, and the subject of responsive design came up again (coincidence?). The project would be for a pretty big web site, but had to happily live on the web, on a tablet, a smartphone, and even on someone’s big screen at home. So, the manager asked me what I think of, or more so, what does responsive design mean to me? How would I approach it?

My answer (and this is why I’m recording this for history): Responsive Design is pretty much the same as branding (if you worked in advertising or marketing you’ll get this – if not, then wait and you will). Take regular Coca-Cola as an example. It’s a good brand – everyone knows what to expect when they drink it, no matter if it’s from a bottle or can, i.e different packaging, but it’s the same exact experience.

So when designing a site, it needs to be the same exact experience — people need to feel like whether they’re on a smartphone or tablet or computer, there’s no shock in moving from one to another. And I truly believe in designing for the smallest thing first, where you don’t have a lot of real-estate, as well as people on the go want to get to what they want and need immediately. It’s good design. I highly recommend reading the 10 Principles of Good Design by Dieter Rams.  Or look at it this way. If you buy an 800 square foot house, are you going to buy a ton of furniture, or enough to make it a nice place to comfortably live? Also, think about what you need so that if you go up in square footage, it will work equally as well – but the idea is it still works and still feels like home. You might add on a few extra pieces to compliment what you already have, or lay it out a little different, but it’s still the same content.

Now that I have that recorded for all history, I can move on now.

Design – Taking the Complicated and Making it Simple

I love to find ways to make something simple out of something that can be so complicated when it comes to designing an app or product. I just have this innate feeling that no matter how complicated something can be functionally, for the end user that something should be the most simple approach to create a great experience.

There’s some great examples of very complicated products or devices we use everyday, that in the end are a very simple solution for the end-user. The iPhone, the iPod, the iPad, a toaster, a clock, a pen, a mouse – and so on.

Usually in software development, a business case is made along with requirements, and sometimes those requirements are very complicated. I tend to have some crazy idea pop in my head (really!), especially when put on the spot and there’s no real time to do research, or flesh things out, that almost all the time solves a complicated problem in a very simple way. It’s something I’ve done since I was very small (I’m now very tall..), and maybe it comes from approaching things from both a user perspective, and sometimes a child-like innocence as well.

So it dawned on me today during a conversation to use a leaf as an analogy for design from both the complicated to simple.

To the average person (the user let’s say) a leaf is nice looking, pretty, leafy.

When the seasons change, it changes color- still leafy and pretty to the passerby.

And that’s the simplicity of a leaf- at least to the user.

Now for the fun part…

Ever look at a leaf up close? Really up close? There is a LOT of coding going on in one of those little guys. Complicated coding.

First off, look at all the structure. Lots and lots of structure. There is no mistake in what’s going on in a leaf. Next, it converts carbon dioxide into breathable air. Nothing else does this as easily or efficiently. Who thought of this? (answer: God)  And the whole changing colors thing? WOW!  Millions of people flock to the east coast to watch the changing of the colors…

So next time you’re designing and developing an app or product, think of the leaf.

 

Random Thought – An interesting morning…

I have a Honda Rune. Google it.. really..just Google it.

When people ask what I ride – after they’ve seen me walk into work with my helmet, or see it at my desk, they ask “So, what do you ride”. I tell them, and either they say “Oh, nice” (they really don’t know what I’m talking about..), or look puzzled, and in either case I tell them to Google it.

At the bottom of this I’ll post a pic. But Google it, because the pictures of it only tell maybe a tenth of a story about a bike Honda decided to make for only 2 years, at what’s reported at a production cost of $100,000 per bike. So, the best guess is there were only 3,000 made, and a quite a few were shipped to Japan, and then deduct how many were wrecked by bad riders, etc.

As a kid, I loved cool muscle cars, as did my older brother, which was something that was in us from birth, and my dad was more than happy to help us along in that when he brought home a 1971 Ford Ranchero Boss GT with the 429 Cobra Jet engine and Hurst shifter… yeah…I’d say we were pretty lucky to have such an education. I think almost all boys, and some girls – my wife loved muscle cars since she was a kid as her dad had an appreciation for them, and my daughter digs old muscle cars t0o – get it.

So it’s no wonder when they see a Rune, which pretty much doesn’t look like most of the other bikes out there nor sounds like one – it’s been said the sound of a Rune, as well as accounts from people I know who have commented on it, is akin to: An angry Porsche 944, a Corvette, a 1971 Mustang GT fastback, a 1970 Camaro SS…and even a p51 Mustang airplane in flight..

All I know is it sounds cool, like a muscle car, and not a Harley or crotch rocket.

The other day I decided to ride into work- I ride the Rune in pretty much 2-3 times a week depending on weather, or if it’s really foggy in the morning (won’t ride), and so on. I take the same route every time though.
But the other day was different, because I was at a stoplight on the bike in front of a church pre-school, specifically the yard area where all the kids are playing in the morning.
As I was sitting there, I looked over to see them playing, and noticed not one, but 4 or 5 boys at first stop what they were doing, and run up to the fence to check out the Rune. They waved as I looked over, I waved back. Then a few more came to look, until there were about 10 or so kids staring at the bike.
As the light turned green, I revved up the Rune and went, watching as they stood motionless, heads followed, mouths open and eyes locked on this rolling piece of art.

That was a pretty cool morning.

Thinking outside the nano-box

So, you have your nice little iPod touchscreen Nano. Check.
Your faithful watch died due to some event (uh, replacing the battery killed it completely…). Check.
You need a new watch, but don’t want to fork out a bunch of money for something that just tells time. Check.

So what do you do? Interestingly enough, I’m currently in this predicament-though I don’t have a niPod nano. I love watches, but don’t want to spend a ton of money on one, and also, don’t want a watch like everyone else has. I want a watch that has a nice design aspect to it, from the look as well as the overall function of the watch.

So, this morning I happened to read about a website called Kickstarter, where people with creative ideas can fund their projects. One such project is for the Lunatik and TikTok watch kits that turn your new iPod Nano into a wristwatch.

That is a very cool idea.

RunePaks -Industrial Design

About 3 years ago, I set out to do something not most sane people would think of doing – create a product that has an extremely small market share, has some huge competitors, and at most I’d be able to sell maybe 20 units — if I was lucky.

To go back some time before that, I was unfortunate enough to see the most beautiful street motorcycle I had ever laid eyes on — The Honda Rune. The problem: If I got one I had to make it functional in that on nice days it would be my main mode of transportation, so I had to be able to carry my messenger bag, lunch, some dress shoes, slacks in case of meetings, and other stuff. Also, room for a passenger helmet would be nice too.

The Need: A nicely designed motorcycle bag that wasn’t square, was designed to look like it was a natural part of the Rune, fit a full size helmet,  needed to be aerodynamic, and wasn’t ugly.

The Problem: There are only 3,300 Runes. At best 1% of the owners would buy these. There were a lot of other after market manufacturers that made motorcycle bags, BUT only one who was going to make them for the Rune. So, I had to contend with some of those buyers would get theirs. On a side note, I ended up selling 10 units, in about the same time frame as the other maker sold theirs and about the same amount.

The solution: Something organic looking, fiberglass, lightweight, can be easily taken off when needed, and lots of room inside. I started with a Photoshop mockup which I then showed to other Rune owners. This was the first mockup:

Everyone thought they looked cool. So I designed about 5 different iterations in illustrator  and ended up with this:

Then for fun I did some 3D modeling, though the Illustrator art was used for the models:

Then came the fun part- making the model! We did this using the templates from Illustrator and good old modeling foam.

After a few mods, tweaks, shavings, etc., molds were made and the first bags were pulled:

They looked great!

And fit a full size helmet without being too bulky:

One thing I did as a backup: Make the design work so someday we could pull bags for the Honda VTX from the same mold, using plugs for Rune specific features. What the bags would look like:

Software Design — This is Different

I just noticed while on LinkedIn it’s been 33 days since my last post. A lot has happened between then and now- namely I got a job with HP (as a contractor for the time being) at the beginning of February. As a software designer nonetheless.

Actually, I’m currently doing interaction design and eventually some prototyping in Flash for what I think is one of HP’s coolest products – the web enabled Photosmart Premium TouchSmart Web printer. The kicker is after working in film, television, animation, graphic design, multimedia production, and then the web, I never saw this coming.

I have always loved good product design and industrial design to some degree, and know it takes a team of people to make a product go from concept to completion.

That’s a process that has always intrigued me, and I even had some experiences on my own with it on a very small level – one in developing a licensed consumer video game for Mac and Windows, which was basically me at the helm (with TONS of God’s grace), and a few friends to help out; and the other with the motorcycle fiberglass luggage I designed, developed, and had manufactured.

So, I guess I can say that even though I have had some experience to some degree in product development (and no where near what HP does…), I never saw myself as a software design engineer, or interaction designer, or prototyper, though in my past various jobs and own projects, I have been all of those at one point or another, but I never held the title of any of those, nor thought that was part of my career path.

My point is it’s amazing what one sees as their profession or career path, yet never sees all the job possibilities that can and do happen during that when we’re so focused on just doing our job that we were hired for, or working on some sort of hobby, learning new skills without even realizing it until someone else sees that in us, and sometimes just letting God be the one to direct us as to where we need to go next.

I am so blessed…

Random Thoughts — The Wireless Mobile Web

We’ve been pretty much accustomed to having web access the past number of  years now on laptops, tablet PC’s or home computers thanks to WiFi, and even more so since the introduction of Apple’s iPhone.

Since the iPhone came out, and gave people true web access from anywhere without having to carry multiple devices, letting us view the web the way it was designed (anyone who had a Blackberry device and tried web surfing pre-iPhone knows what I’m talking about), it now seems all the phone makers have followed suit with their smartphones, hoping to be the ultimate iPhone killer.

This post is not so much about the iPhone, or other smartphones, but something I wrote about nearly 8 years ago. While at Stellcom, I was pretty hot about where we’d be in less than 10 years with technology and devices we could carry in our pockets that would let us surf the web, see movie previews as we drove past a theatre, and even buy tickets. This was before the advent of 3G. There wasn’t a 3G network, and we were still pretty much in what was the first generation phone or data network – eg it was very slow for any data transfers.

So, I present to you a white paper I wrote on what I called the wireless video world, though I do talk about how wireless devices would allow us to do so much more. I focused on video because I was really into video production and streaming, knowing someday soon people would be able to watch real time video on handheld wireless devices (FloTV anyone?).

Qualcomm hadn’t even begun to work on it yet, but a small company in San Diego called Packet Video had, though what they offered could be considered at the time something similar to the very early days of Apple’s QuickTIme — 5 frames per second video sent in packets to one’s handheld device. Note that only some phones allowed this as well as some early handheld devices, tethered via WiFi. The Blackberry could not – it was merely a portable email device when it first hit the streets.

So, I give to you the white paper I wrote. Keep in mind this was written about 8 years ago. Though my writing has improved over the years (whose doesn’t?), you should get the gist of what I was getting at at the time. I don’t consider myself any kind of futurist or Svengali of Technology. At the time I was just a senior designer, but I  wanted to take my best guess as where technology should be heading.  I think I came pretty close, but I’ll let you decide.

Although the paper was in it’s second draft (I never got to finish it), I challenge you to look at what I predict in it, and then look at what we have available today, less than 10 years later.

Wireless_Video_World(v2)

Web Design Part 2 – Color

There seems to be a lot of people who like to design web sites, and or anything else, that don’t understand color theory. Let it be known that knowing color is very important in any design work, whether web, logos, print, even painting your house or office – if they let you have more than white walls or are stuck in a cube. I just came from an office that was an endless sea of gray cubes, with very cool spectrum lighting. Perfect for programmers and engineers, horrible for designers/creative types.

There are 6 separate color themes, all based on what’s called a color wheel. The color wheel is a pretty good representation of color theory. If you have any good paint program like Photoshop, Corel Painter (that has a very nice one), you know what the color wheel is. Even Mac’s come with one built in with tons of features. This is what one looks like:

color-wheel1

Or go to your local art supply store and buy one. They’re fun and cool to have around, and look like this:colorwheel

Plus, your friends will ask what it is. Make sure you put it next to a really sharp xacto knife, a straight edge, and a hand waxer (used for paste-up, way before cut and paste on computers), and then you’ll have some great conversation pieces. Just make sure you keep your thumb or fingers out of the way when showing how it all works. Trust me.

I can type up a whole lesson on color theory, but I suggest you Google it, or check out this site which I like a lot: Color Wheel Pro: Color Theory Basics.

Motorcycle Design 2- things that make a bike more than a toy.

Motorcycles are a very cool and economical form of transportation, whether for fun or work. One thing missing from most bikes is storage. Unlike a car, there is no trunk or rear cargo space to stash your stuff whether heading off to work or on a road trip. When I first saw the Rune, that was something I noticed right off the bat. I researched it on one the of the best sources for Rune’s- Runeriders.com, and found indeed there was no real luggage made for the it. The one manufacturer who made a lot of custom stuff (Corbin) was supposedly not interested — not enough Runes on the street to make it worth their while. So I set out to design a set of hard bags that complimented the lines and shape of the bike. After going through several designs, getting feedback from Rune owners on the site, making changes here and there, I released a set of bags I called Runepaks about two years ago. Needless to say, everyone who saw them while in R&D and said they’d buy a set didn’t. I did end up making and selling about 12 sets, but not before Corbin beat me and came out with their own. Although the design was way different, and the bags looked physically larger, they only managed to sell about the same amount. It seemed people who liked my design hated their’s, and vice-versa. The beauty of my bags, should I ever be able to sell the design and production molds, is they work on other bikes. Here’s some examples:

leftsiderichrearrichrightsiderich

The problem with almost all motorcycle bags is they’re not aerodynamic (an important factor I think), bulky, and always look like some box attached to the side of the bike as an afterthought- which, as we all know, they are.

One company I really admire though, even though they don’t make side bags (yet, but I’m working on them), is Haro Design/Axio of San Diego. Working in a really cool angular building near the ocean, sticking out like a beacon amongst some non-descript apartments and beach bungalows are a team of designers making some very cool storage solutions for motorcycles and their riders. Haro Design is run by Bob Haro, legendary BMX champion and designer of Haro BMX bikes. Axio, his accessories company, makes stuff from tank bags to tail bags to back packs (which will make you look like a Star Wars Biker Scout) to stuff for your laptop and iPod. That’s one company I would really want to work for, designing the next cool thing. You can check out there site here: http://www.axio-usa.com/, and Haro’s site here: http://www.harodesign.com/.

And some examples of what I think is great product design from their studio: Note that the tank bag also becomes a back pack, and the tail bag gives back support…

tankbag_ctankbag2tailbag_stailbag2swift_2_redPicture 2

How many Biker Scouts have room to carry their copy of Roadracing World and their trusty MacBook? I would say none. Rider with Axio Swift 2.0 – 1, Biker Scout- 0. If only Axio made these in a shiny Imperial Biker Scout white…

Motorcycle design part 1

I love motorcycles. Actually, I love any vehicles that are nicely thought out in design, both in form and function. I had been riding dirt bikes since I was about 10 years old, and though I’d see a cool street bike (cruiser, chopper, or crotch rocket) every now and then, I really didn’t want one of my own — until a few years ago when I was at the local shop looking for my son’s first dirt bike. Sitting in the front of the store was this HUGE black and chrome beauty with swooping lines, lots of chrome, an art deco style radiator shroud akin to a 1930’s Cord 810, a swept rear fender, and a saddle you’d find on the finest thoroughbred race horse. On the seat was a huge sign “Do not Sit on Bike”. So I asked my manager buddy if I could. “Yep” was the answer, and a year later I had a candy black cherry beauty in my garage. 1835 CC engine, lots of cool, people always come up to ask what it is, etc. Honda made it for only 2 years between 2004 and 2005. They haven’t topped it since. 2004 Honda Rune

runefront

2004 Honda Rune