Details.so: Inspiratie voor Webdesign

Wat maakt Details anders dan andere designgalerijen?

Details richt zich op de onderdelen die geweldige websites echt sterk maken: hero-secties, footers, paginatransities, preloaders en de micro-interacties daartussenin. Elk voorbeeld is vastgelegd van een live productiesite, handmatig getagd en wekelijks toegevoegd.

De meeste galerijen verzamelen screenshots van volledige pagina's, wat betekent dat het vinden van één geweldige footer of preloader vereist dat je door volledige sites graaft. Bij Details is elke capture gecategoriseerd op het exacte detail dat het toont, zodat de juiste referentie slechts één filter verwijderd is. Alles is handgeplukt van productiewebsites; er zijn geen conceptontwerpen die nooit zijn gepubliceerd.

Hoe kan het bestuderen van deze voorbeelden mijn werk verbeteren?

Hoe meer uitzonderlijke interfaces je bestudeert, hoe gemakkelijker het wordt om de spatiëring, hiërarchie, beweging en interactiekeuzes te herkennen die een website doordacht laten aanvoelen. Na verloop van tijd worden deze beslissingen instinctief, waardoor je sneller van een lege pagina naar een sterke richting kunt gaan.

Waarom niet gewoon volledige websites bekijken?

Galerijen met volledige sites zijn nuttig wanneer je een brede richting nodig hebt. Maar het vinden van één sterke navigatie, footer of transitie betekent dat je site na site moet openen en scannen. Details organiseert de exacte onderdelen, zodat je relevante benaderingen in minuten kunt vergelijken in plaats van urenlang te zoeken.

Kan ik deze ideeën gebruiken zonder te kopiëren?

Ja, als referenties en niet als templates. Bestudeer wat een idee effectief maakt, combineer het met andere referenties en pas het aan de inhoud en het merk van het project aan. Geweldig werk wordt niet gekopieerd van één bron; het wordt samengesteld uit vele goede beslissingen.

Is Pro de investering waard als ik regelmatig websites bouw?

Waarschijnlijk wel. Eén nuttige layout of interactie kan uren aan zoekwerk besparen en helpen om een gemiddeld project te veranderen in een project dat doordacht aanvoelt. Pro geeft je toegang tot de volledige bibliotheek en alles wat wekelijks wordt toegevoegd.

Categorieën en Designelementen

De bibliotheek is onderverdeeld in verschillende types elementen en stijlen:

UI-elementen

  • 3D
  • Accordions
  • Knoppen (Buttons)
  • Kaarten (Cards)
  • Carrousels
  • Lijsten
  • Modals
  • Rijen (Rows)

Structuur

  • CTA (Call to Action)
  • Footers
  • Hero-secties
  • Juridische pagina's
  • Navigatie (Drawer, Dropdown, Fullscreen, Morphing)

Pagina-secties

  • 404-pagina's
  • Artikelen en Blogs
  • Case Studies
  • Contact
  • Content & About
  • FAQ
  • Features & Services
  • Stappenplannen (Steps)
  • Nieuwsbrieven
  • Portfolio
  • Pricing
  • Producten
  • Social Proof & Testimonials
  • Logo's
  • Statistieken (Stats)
  • Team & Timeline

Transities & Laden

  • Contextuele transities
  • Paginatransities
  • Preloaders
  • Sectietransities

Scroll-effecten

  • Media Showcase
  • Scroll-animaties
  • Horizontale scroll
  • Parallax
  • Pinned Scroll
  • Stacked Scroll
  • Tekst-showcases

Pointer & Hover

  • Card Hover
  • Cursor-interacties

Industrieën

AI, Architectuur, Kunst, Crypto, Educatie, Mode, Finance, Food, Gezondheidszorg, Horeca, Industrieel, Juridisch, Media, Muziek, Portfolio, Product Design, Vastgoed, SaaS, Sport, Studio, Video.

Stijlen

Brutalist, Corporate, Editorial, Experimental, Image-led, Luxury, Maximalist, Minimal, Organic, Playful, Retro.

---

BETA MCP: AI-integratie

Je AI heeft nu toegang tot "smaak". Handgeplukte, originele en high-end designs van het web zijn nu direct beschikbaar voor je AI-tools.

Hoe het werkt

  1. Vraag wat je nodig hebt: Vertel je AI waar je aan werkt en ontvang relevante referenties direct vanuit Details.
  2. Kies wat je leuk vindt: Verken de referenties samen. Mix een layout van de één met beweging van de ander, of kies de richting die goed voelt.
  3. Maak het eigen: Je AI begrijpt hoe elke referentie werkt en kan die ideeën aanpassen aan jouw project.

Aan de slag gaan

MCP-toegang is inbegrepen bij elk betaald Details-plan.

Integratie per tool:

Claude Code

  1. Registreer Details via de terminal:

claude mcp add details --scope user --transport http https://api.details.so/mcp

  1. Open het MCP-menu met het commando /mcp en kies Details.
  2. Kies 'Authenticate' en log in op je Details-account in de browser.

Cursor

  1. Ga naar Settings → Tools & MCP en kies New MCP Server.
  2. Voeg de volgende configuratie toe aan je mcp.json bestand:

``json { "mcpServers": { "details": { "url": "https://api.details.so/mcp" } } } ``

  1. Zoek Details onder Tools & MCP, kies Connect en keur de toegang goed in de browser.

Codex

  1. Registreer de remote server via de terminal:

codex mcp add details --url https://api.details.so/mcp

  1. Start de login-flow:

codex mcp login details

  1. Log in en bevestig de aanvraag.

v0

  1. Open het menu voor MCP-verbindingen in de chat-input.
  2. Kies Add MCP, noem de verbinding "Details" en gebruik de URL: https://api.details.so/mcp
  3. Selecteer OAuth en log in om toegang te verlenen.

Andere AI-clients

  1. Open de integratie- of MCP-instellingen van je client.
  2. Voeg een remote HTTP MCP-server toe met de naam "Details" en de URL: https://api.details.so/mcp
  3. Gebruik OAuth (indien beschikbaar) om in te loggen.

---

Veelgestelde vragen over het Verwijzingsprogramma

Hoe werkt het verwijzingsprogramma?

Deel je unieke link met vrienden. Wanneer iemand via jouw link lid wordt van Details en een betaald abonnement afsluit, telt dit als een succesvolle verwijzing.

Wat telt als een succesvolle verwijzing?

Een verwijzing telt wanneer een nieuwe klant zich aanmeldt via jouw link en een betaald plan kiest. Terugbetaalde, betwiste of frauduleuze aankopen tellen niet mee.

Wanneer worden beloningen vrijgeschakeld?

Beloningen worden automatisch vrijgeschakeld zodra je een bepaalde mijlpaal aan verwijzingen bereikt.

Hoe ontvang ik mijn beloningen?

Dit verschilt per beloning. Details-tegoed en Lifetime-toegang worden direct aan je account toegevoegd. Voor fysieke beloningen nemen we contact met je op voor de levering. Bijdragen voor de "Setup Upgrade" worden normaal gesproken via PayPal verzonden.

Hoe werkt het Setup Fund?

Bij 30 succesvolle verwijzingen ontgrendel je een Setup Fund van $500. Elke 10 extra verwijzingen voegt $200 toe aan dit fonds en ontgrendelt een nieuw verzoek voor een Setup Upgrade. Er is geen limiet aan hoe groot dit fonds kan groeien.

Waar kan ik het Setup Fund voor gebruiken?

Voor alles wat je creatieve werkplek oprecht verbetert. Denk aan een monitor, stoel, laptop, tablet, camera, toetsenbord, software of andere tools.

Hoe maak ik gebruik van mijn Setup Fund?

Kies iets dat je werkplek verbetert en dien een upgrade-verzoek in. Vermeld wat je aanschaft, wat het kost en welk bedrag je uit het Setup Fund wilt gebruiken. Na beoordeling wordt de bijdrage meestal via PayPal geregeld.

Moet ik het Setup Fund in één keer gebruiken?

Nee. Je kunt één Setup Upgrade-verzoek indienen bij elke mijlpaal van 10 verwijzingen. Ongebruikte bedragen blijven beschikbaar voor de volgende mijlpaal, maar ongebruikte verzoek-mogelijkheden stapelen zich niet op.

Kan ik een beloning uitwisselen of wijzigen?

Vaste beloningen worden geleverd zoals getoond en kunnen niet worden ingewisseld voor contant geld. Bij problemen met fysieke leveringen in jouw land kun je contact opnemen voor een oplossing.

Kan ik mezelf verwijzen of meerdere accounts aanmaken?

Nee. Zelf-verwijzingen, dubbele accounts of nepaccounts zijn niet toegestaan.