The Challenge
Nira needed a Shopify site that would be very customizable according to their specs that you don't normally need with an app. Some of which were simple color changes they wanted to do. Others were turning features off and on, or having images fade in from the left or right.
The biggest "hurdle" of this project was the amount of custom sections needed. Of course this wasn't a problem at all.
My Role
I was the development lead on this project. The coding involved was a bit of JavaScript and CSS. Of course when dealing with Shopify, JSON is needed to make things work!
I created about 30 or so custom sections for Nira to place when they want to change things up.
"Simple" Slider
Although this looks like a simple slider. Nira needed more control over the placement of the text. I gave them plenty of options to maneuver the text and the background images.
Before & After Slides
You may have seen these around. By using a before/after script library, I was able to give Nira the ability to upload any images they needed without going into the code itself.
Load/Unload videos
These videos hosted were in Vimeo. By scripting the videos to load/unload completely from an iframe was a great approach to this - and yes they are responsive!
Just Circles
The client wanted a way to have their images either in a circle or not, all while telling the story of their customers.
Before & After - Just Bigger
This is based on their before and after sliders. I was able to give them even MORE options so they were able to click and go. A user clicks on the thumbnails and the larger images show a before an after.
Custom CTA
There's more to this section than meets the eye. Image & text placement are critical here. A bunch of text fields & buttons can be turned off and on when needed. The flag also needed to be customized for full font and color control.
Detailed Collection
By using an existing Shopify section, I was able to add a few more details to the collection as well as give the client a better color customization.