This slider has a dramatic and bold design that uses grey, white and a faded turquoise to great effect.
The main slider has a medium grey border. Hovering over the slider brings up the navigation arrows. There are large faded-turquoise circles with a bold arrow in the center. The arrow casts a straight-edged shadow of the kind that is often seen in ‘flat’ design.
Clicking on the navigation arrows cycles you through the images.
In the bottom left corner is a caption. The caption has a grey background, the same color as the frame. It extends seamlessly from the frame on the left-hand side of the slider. The text is a very light grey, with a faded turquoise drop shadow behind it. The drop-shadow is also hard-edged, again as seen in ‘flat’ design.
The font used is Fjalla One, a sans-serif font that has been designed for screens. The font is both tall and bold, and gives the slider a sense of dramatic flair.
At the bottom of the slider are a series of turquoise circles. Each one represents a slide. Most of the circles are transparent, with a turquoise border. However, when the circle linked to the current slide is on display, the circle turns completely turquoise.
Hovering over a circle creates the same ‘solid fill’ effect, and brings up a preview of that slide. Each preview image has a turquoise border and a small arrow at the bottom that points to the relevant circle. Clicking on a circle displays the relevant slide into the main slider. As a result, people can navigate directly to the slide they are interested in without having to skip through slides sequentially.
The default change effect is called ‘stack vertical’, and the images drop slowly in from the top of the slider. The transition feels very smooth, almost weighty. It is a good, simple choice that reinforces the bold design of this slider.
Other change effects that would work well with this slider are ‘glass parallax’ and ‘book’. These are both simple but smooth and dramatic transitions that complement the slider well.
The eye-catching design of this slider means it would work well on a similar website. A website that uses a ‘flat’ design would find this slider blends well with their site.
This slider would work for almost any industry, but is particularly suited to fashion websites and e-commerce stores that specialize in clothes. It would also work well for photographers that want to showcase their photographs. Bloggers would also benefit from the dramatic design of the slider.