Web design: The EHR Group

I wrapped up a web design project a couple months ago for The EHR Group.

Original EHR Group web site Mike Uretz, the Executive Director, came to me with a several-year-old FrontPage web site. Mike thought the web site looked dated and wanted something more contemporary. As his business consults with medical professionals about what electronic health record system would be best for them, he wanted his web site to appeal to both people who would be familiar with technology but also to be easy enough to navigate for people who weren’t very computer savvy.

I started out with some rough greyscale screenshots to provide different layout options. These are some of the ones that weren’t chosen:

EHR Group wireframes

The chosen design used tabs to help indicate the section and had both dropdown menus and left column submenu areas to provide obvious ways for a user to navigate the site.

I then started to work on some rough ideas for the home page layout, then worked on color schemes, shown in the screenshots below:

EHR Group color ideas

At this point, Mike still wasn’t sure exactly what he wanted on the home page. He had some ideas about the types of content areas he wanted but hadn’t yet pulled together the specific marketing text and messages that he wanted to convey. My initial round of screenshots had used a wireframe concept to lay out the content areas, using grey boxes and short placeholder text to delineate content areas. However, we hit an impasse as Mike expressed dissatisfaction with the direction of the design. Both Mike and I were still feeling each other out and trying to figure out how to best work together and communicate; it took a few phone conversations for me to realize that Mike was a very visual person and actually didn’t work well wireframes and content placeholders. So, I asked Mike to develop the specific content and wording he wanted for the home page while I built the HTML and CSS for the other pages. Then we went back to redesigning the home page, which went a lot better once he could see the actual content in the screenshot.

EHR Group home page layouts

Below is the final result for the home page. Mike liked heavier use of graphics for the home page, including the two bottom left graphics, which we used in the other pages as well.

EHR Group home page

I had tried using smaller graphics to accent the pages initially, but Mike thought they were too artificially slapped into the content area. He liked it much better when I tried putting a larger graphic into the background behind the text. Each page has a different image related with the content.

EHR Group about page

By the end of the project, our working relationship had smoothed into a good flow. I understood Mike’s communication style; he was able to trust my design and working process. We were both very happy with the final result, which allows Mike to use Microsoft Expression Web to make minor changes to the wording himself. This is a project that I’m excited to add to my portfolio and which has taught me many valuable lessons about customizing my process to fit the needs and personality of the client.

6 thoughts on “Web design: The EHR Group

  1. I am known for my hatred of images as background on a webpage (or pretty much anywhere). You have completely changed my mind with this design. It’s awesome and thank you for the tour of the process.🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s