Vereschagin Law Firm Website Redesign

vlf-desktop-homepage-final.jpg

Project Details

Project Responsibilities
Project Manager and Front-end Web Design.
Tools Used
Atom, BitBucket and WordPress.
Coding Languages
HTML, CSS and Bootstraps.

Project Background

The Vereschagin Law Firm had a traditional marketing system through word of mouth. They wanted to become an online presence but lacked the technical background to accomplish this. The company had not built a brand identity or a significant website presence. I agreed to building a professionally designed website.

Project Challenges

To create a professionally branded, responsive website.

Project Solutions

I utilized the WordPress CMS and chose a responsive 3rd party template that could be easily customized through CSS. The client wanted a very neutral but stylish brand. A cool color palate of light blues and greens accomplished this goal. Additionally, animated banners were chosen for the front page to advertise the different services. The award badges at the bottom of the front page lend credibility to the offered services. I was able to optimize the website for local search.  I also managed an off-page SEO campaign for local search and  produced top rankings for 5 of the 10 targeted keywords.

Original User Interface Design

vl-original-homepage1.png

Interface Explained

I had to create a more user friendly user interface so that the user could more easily navigate the website.

Hifi Photoshop PSD Comps

vlf-homepage.png

vlf-homepage.png

vlf-mobile-home-page-hifi-comp.png

vlf-mobile-contact-page-hifi-comp.png

Hifi Comps Explained

I had to create a more user friendly user interface to match our design patterns and build a better user experience.

Final Product

vlf-desktop-homepage-final.jpg

vlf-desktop-homepage-final.jpg

pog-blog-final.png

pog-mobile-final4.png

Conclusion

By the end of the project our team had completed a total of 40 eLearning game templates. We used GitHub for version control and error reports. I was also responsible for reporting/fixing bugs and cross browser testing for desktop. The minimum requirment was that all game templates must work in ie 9 and up. The original assumptions that we could design for a responsive experience was incorrect. The frame work relied on an iFrame to import the game template, meaning that responsive environment was removed because of the iFrames limitations in modern web borrowers. The solution that I came up with was that I designed all my templates for a responsive experience and then I changed the final template to a fixed width and removed the calc responsive width in css. This will allow for future developers to easily make the template responsive when the iFrame is depreciated for future browsers.

Responsive Content Development

Tools Used

Plugin: Responsive Slider
Code: Short Codes
Graphics Programs: Photoshop, Fireworks

Project Details

It was imperative that the website have a similar viewing experience when viewed though different hardware and that the mobile design have a Call Us call-to-action buttons on all pages.

Challenge

The 3rd party template used to build the desktop website’s mobile design was below standards.

Solution

I created an m. url and built the mobile site using a third party software. Also, I created all page layouts and media assets including the front page image sliders. Additionally, I removed all information that could not be consumed in a couple of seconds and added Call Us call-to-action buttons on all pages.

BACK