Case Study

Emma Power

Website: www.emmapower.com
Services: design, develop, deploy, optimisation, seo-setup


A minimal design for the amazing Emma Power.

Emma requested a website after seeing sunnycopy.com and fell in love with the simplicity and focus on words. Herself being a speaker, writer and teacher she too needed a website where the copy was crucial.

Who doesn’t love a one line brief?

“simple and easy to navigate”

Emma

With her her simple one liner, I had enough breathing room to fill a stadium. This kind of freedom can easily be a curse if you don’t take a direction early on and stick to it.

Sunny Copy was a static html website, while Emma needed the ability to blog. So I needed a CMS and wordpress is my goto for that. Seeing as I’d only been back developing for a short period I’d been reviewing basically every CSS framework under the sun. I wanted a framework that had some bells and whistles but wasn’t bloated. I was hoping to choose the right one, being able to use it for more projects down the line. Then I came across Uikit; it was modular, so it could be lightweight and powerful.

But here’s where I went wrong. The mob behind Uikit also have made a wordpress page builder (yoothemes) for throwing pages together fast. I played around with it, it worked really well. So I decided to use it to build the site. The problem with these kinds of page builders though, is you really paint yourself into the corner. They’re great, until you want to do something outside of the tool-set they build in for you to use. Being a dev of course I was going to run into this little problem, time, time and time again…

Dev headaches aside; it took longer than necessary to build. However the design took shape quickly.

Animated gif, text fade in after the image of Emma helping to create hierarchy.
Elements fade in after the image of Emma helping to create hierarchy.

With a focus on the website copy I opted for minimal elements, using animation to bring the text to life.

An animated gif of page design, text moves and fades in to nice effect
Gentle animations to text create a calm energy.

These small touches allowed me to incorporate less images and focus on the words.

To round things up I’d have to say I was pretty happy with the outcome.

It’s beautiful, and I can see how every detail has been so well thought through. – Emma

Emma was happy and she had a professional looking website that communicated her words in a way that represented her honestly.

Performance Score for Emma Powers website by GT Metrix. Pagespeed Score 98%. YSlow Score = 93%
There was a lot of tweaking of the server with this website. I hadn’t used siteground as a host before nor the YooTheme framework. It resulted in a number of caching compatibility issues that had to be ironed out.
Technical notes: 
- wordpress cms 
- yootheme pro framework 
- uikit3 css framework 
- acf 
- autoptimize & cache enabler 
- cf7 
- the-seo-framework