twosocial.com

Technologies used: Laravel, HTML, CSS, jQuery,

Dec 1, 2015

The decision to revamp twosocial.com came as the company needed to refresh their online image. The old website was a custom Wordpress build which aesthetically had grown outdated. 

Front page of twosocial.com. Shows a cartoon man about to bungee jumpContact page of twosocial.com. 7 tiles are displayed with contact details.

Two Social wished to not only refresh their website aesthetic, but to also use it as an opportunity to promote and demonstrate the companies evolving creative services, that is somewhere to showcase video, portfolio pieces and more.

While Wordpress would have been suitable to meet these requirements, employees had shown some confusion on using Wordpress's interface; were failing to upload articles correctly or utilise SEO effectively. There was also a difficulty in getting employees to even use the website.

twosocial.com's blog page.Screen shot of twosocial.com's article page. Article is titled 'new thing that bombed'

A final idea for the new website would that it would be extendable and offer software like services in the backend. It would be an intranet of sorts and allow employees access to things like report builders, password managers, dropbox integration, a custom calendar and more were some ideas to bake into the website.

With all these things in mind, I decided to build in Laravel as it would provide that high level of customisation in areas where Wordpress had been insufficient. I worked with the design team to create a backend from the ground up, where the aesthetic would be simple, and instruct employees exactly on what had to be included in content and how to include it.

screenshot of twosocial.com, showing the admin dashboard

A feature that encapsulated this idea was the 'required block' which was a dynamic list of instructions that would guide the user through the creation of a blog post. The block would auto update and change depending on how the user went through the site.

screenshot of twosocial.com admin area

The backend further achieved the idea of lessening confusion by stripping out all the cruft of Wordpress and building in a visual tutorial on how to use the site for first time logins. 

screenshot of twosocial.com admin area

To encourage user engagement for employees a gamification system was implemented where users who created content were rewarded points and could unlock achievements to 'level up'.

screenshot of gamification on twosocial.comscreenshot of Andrew Cook's profile on twosocial.com

The website also hooked into Google's analytics API where users could see page views on content they created from their dashboard, and the site also utilised Disqus's API to show comments just for user's posts from their dashboard.

screenshot of infographic creation tool on twosocial.comscreenshot of twosocial.com media library