Doorgaan naar content

Video analytics and compliance software

facit-logo

Overzicht

Features

Uitgebreid ontwerp met veel contentblokken, Theming, FAQ, Case studies, Evenementen, Teamleden, Lottie animaties

Gebruikte technieken

AlpineJS, Livewire, Lottie, Peak, Statamic, Tailwind CSS

Facit Data Systems heeft zich gespecialiseerd in het digitale analyseren van beveiligingscamera beelden, waardoor ze in staat zijn bedrijfsprocessen te optimaliseren. Ze kunnen gevaarlijke incidenten monitoren en een alarm activeren wanneer iemand in gevaar verkeert, evenals bijhouden hoeveel mensen zich in een gebouw bevinden.

Dave Smyth heeft het ontwerp verzorgd en mij benaderd om de technische implementatie te verzorgen. Als gebruiker van Peak wist hij dat hij bij mij aan het juiste adres was. Technisch gezien is de website zeer uitgebreid. De page builder biedt meer dan 25 dynamische contentblokken die elk kunnen worden aangepast met hun eigen vooraf gedefinieerde kleurenschema.

Screenshot van facit.ai: het beheer aan de achterkant.
Het aanmaken van een blok met kaarten.

Het is mogelijk om verschillende soorten kaarten weer te geven, met afbeeldingen, links, pictogrammen of met grote of kleine titels. Bovendien kunnen kaarten in verschillende lay-outs worden weergegeven. Zoals bij alle Statamic-websites kan de editor via Live Preview de website bewerken en onmiddellijk de effecten van verschillende wijzigingen zien.

Screenshot van facit.ai: het beheer aan de achterkant. .
Een blok met een testimonial.

Andere soorten blokken bevatten onder meer veelgestelde vragen, een contactformulier en testimonials.

Screenshot van facit.ai: het beheer aan de achterkant. .
Een selectie van veelgestelde vragen.

Nieuwsberichten en evenementen kunnen aan de voorkant van de website live gefilterd worden met behulp van Livewire.

Screenshot van facit.ai: het filteren van nieuwsartikelen.
Het filteren van nieuwsberichten aan de voorkant.
Bezoek facit.ai

Als er banen op het spel staan

  • Statamic
  • Peak
  • Tailwind CSS
  • AlpineJS
  • Laravel
  • Plyr
ject.keys(map) }) }) .then((response) => response.json()) .then((data) => { const regions = data.regions; for (var key in regions) { if (map[key]) map[key].outerHTML = regions[key]; } for (const input of document.querySelectorAll('input[value="STATAMIC_CSRF_TOKEN"]')) { input.value = data.csrf; } for (const meta of document.querySelectorAll('meta[content="STATAMIC_CSRF_TOKEN"]')) { meta.content = data.csrf; } for (const input of document.querySelectorAll('script[data-csrf="STATAMIC_CSRF_TOKEN"]')) { input.setAttribute('data-csrf', data.csrf); } if (window.hasOwnProperty('livewire_token')) { window.livewire_token = data.csrf } if (window.hasOwnProperty('livewireScriptConfig')) { window.livewireScriptConfig.csrf = data.csrf } document.dispatchEvent(new CustomEvent('statamic:nocache.replaced', { detail: data })); }); })();