BLOCKS / INTERACTIVE

Thumbnail Slider block

Two linked Swiper instances — a main slide and a thumbnail strip — synced together, with slide, fade, and vertical layouts.

Thumbnails below, default layout

thumbPosition stays at its below default, thumbsVisible caps the strip at 5 thumbnails at once, and clicking a thumbnail syncs the main swiper via view.js.

Vertical thumbnail strip

thumbPosition set to left moves the strip to a vertical column beside the main slide, rendered before .tsb-main in the saved markup.

Fade transition with slide counter

sliderEffect set to fade dissolves between slides instead of sliding. showCounter plus counterPosition right renders a 1 / N overlay in the header row.

1 / 1

Caption overlay + filmstrip with outside arrows

Each thumbnail-slider-item-block carries its own showTopTitle/showTitle/showText plus captionGradient, overlaid directly on the image. arrowPosition set to outside-top-right moves the nav buttons into the header row above the slide.

BRANDING

Meridian Identity System

Complete brand identity for a sustainable architecture firm.

WEB DESIGN

Helios Platform

Marketing site and product dashboard for a SaaS analytics tool.

MOBILE

Terrain Fitness App

iOS and Android app for outdoor workout tracking and trail discovery.