Grey & Grey L.L.P. Case Study

oldgg_final CLIENT:
Grey & Grey L.L.P.

PROJECT:
Site Redesign

DURATION:
Fall Semester 2012

TEAM:
Myself

Project Brief:
Grey & Grey LLP is a law firm that helps injured workers, people of age who need to collect their social security disability benefits and people who have sustained personal injury and feel they have a case. Grey and Grey is in need of a modern, updated re-design. Users who come to their site come to it to gather as much information as they can so as to know what their next action should be. So it will be heavy on information. The goal here is to instill trust through the subtle but pleasing perhaps even calming colors and make the user experience of a heavy informational site more comfortable and simple to navigate by using a minimalist design. This is not an ambulance chasing law firm.

Budget This is a pro bono student project

Research I searched the web for many law sites online and looking for current ones that could inspire the design. Screen Shot 2012-12-02 at 3.13.13 PMI came across a Manhattan based law firm’s site that I found minimal, pleasing, and possible for me to build with my current skill set.

Granovsky & Sundaresh PLLC

Strategy:

  1. Design a clean, minimalist web site that will invite a user using color and font to give the client a nice, maybe calming user experience while he/she is collecting the needed information.
  2. Represent the firm as classy and trustworthy as opposed to giving the site the flashiness and bells and whistles of a firm that one might label “ambulance chaser”.
  3. I also wanted to use the new popular (free) slidewhow plug-in feature by Flexslider 2 (also available as a for purchase widget by Dreamweaver and available for WordPress) to retain some visual interest and give the static site some movement while not distracting the user from his purpose.
greyandgreysitemap

Original Sitemap Proposal

Homepage_grid

Original Grid Wireframe

My first strategy was to attempt using Adobe Dreamweaver’s Responsive Design feature and build a site that would scale to mobile devices and be based on a grid. However, I was not able to crack the Responsive Design technique quickly enough & had to take another direction. So the strategy then became to prepare a solid, fixed width, grid design interface that would not break when re-sized and give it a simple call to action for the client. The other decision quickly made was to hand code the site in a text editor , Chocolat.app, and to use Adobe Dreamweaver for error correction in this particular project.

Layouts:
HomepageAbout

Challenges:

  • Creating a Responsive Design website
  • Re-coding the site to a fixed width design from it’s original fluid, responsive attempt
  • Editing the code in the jquery plug-in slideshow to give the it the look and timing that would suit the site.
  • Editing the content on the site so that it gives the user ‘enough’ information and not ‘too much’ causing the user to become even more overwhelmed.

Updated Design:

Palette:

ggpalette

 

Landing Page- Slideshow

newggsite2

Landing Page – Body

ggopening2

Footer

footer

Effectiveness:
This 10 page site is a good start towards updating the Grey & Grey L.L.P’s web presence. There are still many large and subtle changes that should be made to this site to elevate UX and UI. While I found in my research and agreed that many law firms chose not to have a facebook and twitter presence, I would at minimum encourage the firm to take on a Linkedin presence. I put a button in the footer as if it did exist. Surprisingly the firm did have a WordPress blog which I would encourage them to keep updating regularly as well as well as redesign in a way that would complement their new design. I included links to this blog. One could also address other sections of their current web site and bring them up to today’s standards and practices.

Other Relevant Pages:

Attorneys Page

attorneys

Our Practices ->Worker’s Compensation Page

workcomp

Contact/Locations Page

contact

Advertisements

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