To completely relaunch their website from scratch with new branding and make their site look great on mobile devices.
I worked as the project manager. I also was the sole web designer and front-end developer on the project. Lastly, I served with my coworker who worked on the back-end as a back-end developer to integrate the new CMS. I also helped the server administrator understand the needed hardware specs for the server and set up the full server stacks of Apache, MySQL, and PHP.
As you can see, the previous version of their homepage felt very cramped. It also contained a lot of smaller-sized text. In addition to the design, we worked with the representatives from the college to make sure the new version of the site would also be much easier for them to edit through the Content Management System (CMS). Speaking of the CMS, the previous version of their site was built on WordPress. WordPress is great! It’s the most popular CMS in the world! In fact, this site is built on WordPress. However, I would never recommend it for a website that is expected to have over 100 pages. That being said, my coworker/fellow web developer and I built the new version of the site on ExpressionEngine. It is a CMS that is much better suited for large sites for both speed and usability for content editors.
Their previous sub pages(non-homepage) had large navigation menus and so we helped them rearrange their content to greatly lower the amount of links and pages across their site.
The design process for this site was quite difficult due to the constraints of the project:
One of the main requests during the design phase was for it to be clean and crisp so I purposely kept sharp edges on the elements and the main content areas white to help users to focus in on what they have to say on the site.
The previous version of the site was not responsive so users on phones and other mobile devices had to pinch and zoom to move around the site, but now the site adjust to any size screen that it is viewed on.
Since page load speed was a priority from the start of this project, I did everything I could to make the site load more quickly and the proof is in the numbers. For example, I created a new build system using Gulp to compress my SCSS and JavaScript files into 1 CSS file and 1 JavaScript file. Outside of the homepage, we refrained from using large images(above 2000 pixels in height or width). I also used the quality setting in Photoshop on every image to keep the file size as low as possible while still looking great on retina screens.
Need to touch up your site, or build a completely new one like this project? Feel free to get in touch with me and I’d be happy to help!