Engelgrafik

Jeffrey Engel's work and thoughts on graphic design, information design and user experience.

Vacation Rental websites really should allow View By Map

Tags: , ,

I’ve been researching vacation rental websites for my parents who have been wanting to come up and visit, however I want to put them into a nice location where they’re not trapped in some interstate exit world with just a gas station and a couple restaurants nearby. So I’ve been jumping on the web trying to find some nice places where they might be able to lounge around peacefully but also could easily walk within 5 minutes to a picturesque downtown like Rockport or Salem.

I’m not demanding in terms of actual location. Just the "North Shore" pretty much would suffice, although I’d be open to Concord or other nice inland towns. However, I’m more particular about the actual local "amenities" mentioned above of the location rather than where in the world the location is. So for someone like me, a map with locations would be the most useful solution and provide the best user experience. I could see where all the towns are, like Manchester-by-the-Sea as well as Gloucester and Rockport, all at once, and I could check out all the little dots in and around those towns which would be homes and apartments available for rent.

Unfortunately, very few websites allow you to view by a map. They force you to drill down deeper and deeper and choose actual cities, like this otherwise well-designed website at Vacationrentals.com. This is just time consuming.

Vacation Rental site problems

I’ve never really understood this mentality when it comes to the information design of most Vacation Rental sites in general. That goes for any property rental or even real estate site. A lot of people would rather just view a map, and compare the properties to each other. If you think about it, someone who is looking for a vacation rental, or looking to move somewhere, is someone who most likely isn’t actually that familiar with the region. They have heard of Cape Cod, but have they heard of "The Berkshires"? We New Englanders have, but what about someone from Arizona? Visitors may have heard of Salem, but maybe they have never heard of Beverly, and have no idea it’s right across the river and might have exactly what they’re looking for if they can’t find it in Salem. How do they know they should click on the link for "Beverly"? Without a map, or previous knowledge, they have no idea.

By not providing a map, you are assuming that your visitors know where all those cities are or that they know exactly what cities they’re looking for. The truth is, a lot of people are like me, and they don’t care if they’re in Yarmouth or Sandwich… they just want to find a nice place in Cape Cod that is close this sort of geography, and that sort of activity and so on.

Any kind of property site — whether it’s vacation rental, apartments, condos, real estate, etc. — really should always have some kind of "view by map" function which allows the viewer to use an existing and robust mapping system (like Google, etc.) which features the actual locations of those properties across the map.

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • TwitThis
  • Google Bookmarks
  • StumbleUpon
  • Reddit
  • Technorati
  • LinkedIn
  • RSS
  • Twitter

MobileMe Sync “Conflict Review” is easy to use, but possibly useless

Tags: , , , , , ,

One of the purposes of a Conflict Review process between two pieces of code or data is to highlight the actual differences between those two pieces of code or data. It used to mainly be a feature in the coding domain but has since become quite popular in the consumer and business world for resolving differences when people are merging contact information between two lists, or simply syncing the data between, say, a workstation and an iPhone.

Apple’s MobileMe service is a syncing service which is easy to use and gets the job done for the most part. I use it to sync my iPhone with my various contacts on different devices. At least, that’s the intent. However, there seem to be a particular problem when it comes to the Conflict Review process: It prompts me to choose between two different entries in two different locations, for the same contact, however it doesn’t show me the differences between the two choices.

MobileMe Conflict Review

Now, one might think that maybe there are no differences and it’s just asking which one I want to choose, but that’s actually not the case. If I check the individual contacts, I will see that one listing has one set of information while the other listing is slightly different.

Why doesn’t Apple’s MobileMe Conflict Review show me the differences? This service is seems to me to be useless, and I feel like I’m risking choosing the wrong listing for my iPhone’s needs.

Based on usability best practices, we know that whenever users can’t trust an interface or process to do the right thing, then there is obvious need to fill in the gaps that are evident and causing the lack of faith in the first place. In this case, Apple’s MobileMe Conflict Review needs to show all of the data for each conflicting contact. It’s that simple.

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • TwitThis
  • Google Bookmarks
  • StumbleUpon
  • Reddit
  • Technorati
  • LinkedIn
  • RSS
  • Twitter

Portfolio: design, identity and photo solution for Arlette Laan

Tags: , , , ,

Arlettelaan.com homepageI took on a smaller budget project for a friend and fellow artist, Arlette Laan, who makes really fun dolls and takes wonderful photos. She was looking to update her older site but wanted to retain the orange and blue color combinations that appear to have a strong connection to her Dutch roots. I have found over the years that European color schemes often employ these traditional color combinations. What often happens is that these heavy competing colors will be toned down by the use of a lighter screened color like a light blue. I used this, and a very light Futura font to create her new “identity”, and the old color scheme now frames here entire site. I simplified her menu system on the home page to guide visitors towards her three main offerings. Other links like “about” and “contact” were subordinated on the home page. On the sub pages, all the links were put into a CSS-pure tab menu near the top, and simple links near the bottom of the page.

One of the other things Arlette was looking for was a way to simplify updating the photos on her site. She is always taking new photos, be it landscapes, flowers or even product photos of her dolls. For someone who doesn’t know much HTML or coding, this can be a very time consuming and daunting task. In fact, it can take a lot of time even if you do know HTML, as you always have to deal image sources, links, thumbnails, and what to do about the page which displays the full size photo (do you just open it in a generic browser window or….?).

The solution was to come up with a system that employed an easy to use administrative interface. I found a Flash/XML solution that allowed me to specify sets from Flickr as dynamic content. This made it as easy as uploading a photo into a predefined set at Flickr which already has a great administrative interface. Her photos would now appear immediately.

I feel good about this project as I didn’t allow the small budget to get in the way of good design and simple solutions.

Landscape Photography SubpageDolls subpage

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • TwitThis
  • Google Bookmarks
  • StumbleUpon
  • Reddit
  • Technorati
  • LinkedIn
  • RSS
  • Twitter

Portfolio: Building “The Space”

Tags: , , , , , , ,

Late last year I was hired to come up with a design for a new startup recording studio and café called The Space. They were looking for a site that would have music, video, a snack menu, all while retaining some elegance and be easy to maintain. Now, everyone says they want something elegant, but most of the time people have different opinions and attitudes about what is considered “elegant”. I realized they were pretty serious about what they said since they pointed me to sites like Apple, Kohler and Level Tile and Flooring. This would be pretty easy, I figured.

I started off with something I thought evoked the same feel as their “Place at the Space Café”. It has a rustic modernity with wood beams, curved off-white walls, iron tables and chairs, big leather couches, and black modern branding. I took a cue from Level Tile and Flooring site and whipped up a “box” design since they had so many offerings. The idea is that the boxes would expand into their own pages as you clicked on them. We went through successive iterations, however they ultimately couldn’t get inspired by this design.

Idea for The SpaceIdea for The Space

Idea for The SpaceIdea for The Space

Idea for The SpaceIdea for The Space

Fellow artist and designer Donna Berger was brought in as well and she came up with a different sort of design and the customer agreed on it. It was now my task to build and implement the requirements. If you know anything about XHTML and CSS, you’ll probably agree that the design below requires some major tweaking and finagling especially if the budget and requirements do not call for any Flash development. I was determined to do it with good old elbow grease. Here is a screenshot of the Illustrator file I worked from:

The Space design

A recent decision was made to remove the picture of Jon, the customer, from the front page. Also, additional subpages were added.

FMP3 PlayerIn addition, to get a stream of music going on the site, I employed the use of FMP3, which is an MP3 player that uses the XSPF XML format. It allows the customer to create an XML file which calls MP3s up and plays them on the site. Pretty nifty. Requires a bit of tweaking, and it’s a bit bulky the first time you use it (because you have to set up XSPF, FMP3 and set up the XML file… wish there was a more elegant solution!). But the customer only needs to work on the XML file, which is easy training.

There have been quite a few more developments to the site. The customer is incredibly happy with the ease in which it is to maintain the site, and I am usually only called in to do major updates. Here’s a recent screenshot with changes the customer has made:

Recent screenshot of The Space

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • TwitThis
  • Google Bookmarks
  • StumbleUpon
  • Reddit
  • Technorati
  • LinkedIn
  • RSS
  • Twitter

Portfolio: Chappie Technologies

Tags: , , , ,

There are a lot of boutique development services companies in the marketplace competing on budgets, timeframe and such however Chappie Technologies needed another way to differentiate themselves from the rest of the pack. It was through this need that I became tasked with helping them come up with a new look to their site, and developing some brand assets.

1a 1b

First came the general layout and look-and-feel of the site. What kind of mood were they trying to convey to their customers? Most of Chappie Technologies’ competitors’ sites look a bit jumbled and full of technical jargon that is disorganized and hard to understand. They wanted something that looked clean, progressive and forward-thinking but still rooted in the task-oriented world of programming and IT.

2aWe also worked on visuals and metaphors a bit further into a revision of our initial experimental designs. Visuals that were easy to understand were the first choice, however we didn’t want to just use the same tired stock photography so we made a conscious effort to use higher quality photographs and imagery.

chappie2
After several passes at a logo, we focused on a classic feel, almost nostalgic. This was a logo that had a modern edge to it, yet it also had an industrial 1950s feel to it, conveying a traditional American sense of quality and trust.

Final product

The end result was a design coded in CSS and XHTML, using DIVs instead of tables, however it appears at this moment the customer has reverted to HTML tables. http://www.chappietech.com

This is the design that was eventually chosen.

This is the design that was eventually chosen.

The chosen logo, with a bit of a different take on the sometimes overused globe, focusing more on the idea that Chappie Technologies offers solutions that help their customers navigate the market's waters.

The chosen logo, with a bit of a different take on the sometimes overused globe, focusing more on the idea that Chappie Technologies offers solutions that help their customers navigate the market's waters.

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • TwitThis
  • Google Bookmarks
  • StumbleUpon
  • Reddit
  • Technorati
  • LinkedIn
  • RSS
  • Twitter

Portfolio: Jane Elizabeth Jewelry

Tags: , , , , , , ,

Back in 2003 I had been working on a project for Southern Cross Pin Company which involved photographing and setting up a surf jewelry website using osCommerce. It was a quick and dirty project but it helped me prepare myself for knowing the kinds of needs and requirements that an eCommerce site entails.

Shortly thereafter I started working on a project for Jane Elizabeth Jewelry (originally Jane Jewelry). Jane had several requirements. Jane Elizabeth was being worn by celebrities like Katie Couric and she was getting a lot of press in the Improper Bostonian as well as national mags like Lucky. However she had no commerce solution other than email, telephones and calculators.

Jane Elizabeth Jewelry design, iconography, catalog layout

Jane Elizabeth Jewelry design, iconography, catalog layout

We came up with the following solution:

  • Create a homepage which showed recent and fresh new designs, as well as the latest magazines and media that featured Jane Elizabeth jewelry.
  • Develop an eCommerce solution using the open source osCommerce product.
  • Create a wishlist which would allow people to save their favorite items with an email response from Jane Elizabeth.
  • Create a customer-initiated gift reminder which would allow Jane Elizabeth to send email reminders to people to buy product at certain times of the year.
Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • TwitThis
  • Google Bookmarks
  • StumbleUpon
  • Reddit
  • Technorati
  • LinkedIn
  • RSS
  • Twitter

A new beginning

Tags: ,

If you’ve come to this site anticipating a portfolio containing logos, graphics, design, UI samples, and more, you’re not in the wrong place. It’s just that I’m in the process of catching up to the 21st century by converting my entire site to a more dynamic format: The blog.

At the risk of sounding magnanimous, I often find myself wishing I could jot down my thoughts about certain things related to user experience and how we interact with design in the world around around us. For someone who calls himself at various times an “information designer, “web designer”, “user experience specialist”, a portfolio really is very limiting. I don’t want people to just see pictures of things I’ve worked on. I want people to know what I’m thinking of and how I think about it. Additionally, I want them to see how I solve problems. I’m thinking a blog is a great format to keep people up-to-date with these things I’ve been involved in, and also things I’m currently involved in.

Hopefully, I’ll also learn to write better, and with better expression with minimal effort. After all, this is the hallmark of good design: convey ideas succinctly.

Anyway, so if you don’t see what you came to see, it’s quite possible I’m still in the process of adding those things you would like to see. In the meantime, I’ll be providing a link to my old site from 2005 which is like 20 years old in Internet time.

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • TwitThis
  • Google Bookmarks
  • StumbleUpon
  • Reddit
  • Technorati
  • LinkedIn
  • RSS
  • Twitter

Except where specifically noted, all contents © Engelgrafik