Iridescent Butterfly UI-systeemkaart

{ "type": "UI/UX Design System Demonstratieproject", "thema": "Donkere modus, natuurgeïnspireerde, lichtgevende iriserende esthetiek", "taal": "Chinees", "canvas": { "aspect_ratio": "Vierkante poster", "achtergrond": "Diep middernachtblauw tot zwart, met een subtiele halo", "stijl": "Een hoogwaardig, futuristisch displayproject met een slanke neonblauwe paneelomlijning, glanzende accenten, zachte halo en hoog contrast." } }, "header": { "title": "Natuurgeïnspireerd UI{argument name=\"system title\" default=\"Butterfly Rainbow\"} UI/UX Design System", "description": "{argument name=\"chinese description\" default=\"Geïnspireerd door vlindervleugels, combineert het ontwerp de iriserende glans van structurele kleuren en diepblauw om een ​​lichte, dynamische en levendige digitale ervaring te creëren.\"}", "hero_image": "Een zeer gedetailleerde, lichtgevende vlindervleugel, met elektrisch blauw, violet en iriserend cyaan, beslaat de helft van de rechterbovenhoek. Zichtbare aderstructuren, doorschijnende randen en sprankelende deeltjes zijn zichtbaar, met daarachter een tweede, wazige vleugel." }, "layout": { "sections": [ { "title": "1. Ontwerpinspiratie", "position": "Linkerbovenhoek, onder de titel", "count": 4, "labels": [ "Macro van iriserende vlindervleugels", "Close-up van de blauwpaarse vleugeltextuur", "Lichtbrekende prismahalo", "Vlindervleugelcelpatroon" ] }, { "title": "2. Trefwoorden", "position": "Rechtsbovenhoek, onder de hoofdafbeelding", "count": 5, "labels": [ "iris", "Agile", "Light", "Profound", "nature" ], "icon_style": "Minimalistische gloeiende lijnpictogrammen in afgeronde donkere kaarten" }, { "title": "3. Kleursysteem", "position": "links in het midden", "subsections": [ { "title": "hoofdkleur", "count": 3, "labels": [ "Morpho Blue #1E5BFF", "Rainbow Purple #7A5CFF", "Skylight #00E6FF" ] }, { "title": "Neutrale kleur", "count": 3, "labels": [ "Middernachtzwart #060F19", "Zacht marineblauw #141A2E", "Parelwit #F3F6FC" ] }, { "title": "Nadruk op kleur en verloop", "count": 2, "labels": [ "Regenboogglans", "Vlinderlicht" ] } ], "visual": "Cirkelvormige kleurstalen en verloopbollen, met Chinese labels eronder." }, { "title": "4. Lay-out", "position": "midden rechts", "count": 1, "labels": [ "Aa Poppins Licht / Normaal / Medium / Halfvet" ], "visual": "Grote witte Aa op een donkere kaart" }, { "title": "5. Applicatie-icoon", "position": "Links en midden", "count": 1, "text": "{argument name=\"appnaam\" default=\"Winglet\"} Licht. Wendbaar. Elegant.", "visual": "Het gloeiende vlinder-app-icoon naast de appnaam" }, { "title": "6. UI-componenten", "position": "midden", "subsecties": [ { "title": "Knop", "count": 3, "labels": [ "Hoofdknop", "Secundaire knoppen", "glastextuur" ] }, { "title": "icoon", "count": 2, "labels": [ "Hartvormige collectie", "Verlichte ring" ] }, { "titel": "schakelaar", "aantal": 1, "labels": [ "schakelaar" ] } ], "visual": "Afgeronde blauwe knoppen, neon-icoonknoppen en verlichte schakelaars op het donkere paneel" }, { "titel": "Overige elementen", "positie": "Rechts midden", "aantal": 4, "labels": [ "zoekvak", "Nieuwe tag", "Voortgangsbalk (72%)", "Blauwe Morpho-kaart" ], "visual": "Kleine, praktische UI-componenten in compacte horizontale kaarten" }, { "titel": "7. Mobiele UI", "positie": "Linksonder", "aantal": 3, "labels": [ "Zoekpagina", "Pagina van vandaag met een grote vlinderillustratie", "Audio-afspeelpagina met golfvormgrafiek" ], "visual": "Drie smartphoneprototypes met afgeronde hoeken, een donkere interface en een blauwpaarse vlindervisualisatie" effect." }, { "title": "8. Website Design Preview", "position": "Onderaan rechts", "count": 1, "labels": [ "Life of Light" ], "visual": "Mockup van een desktop landingspagina, inclusief een vlinder als hoofdafbeelding, bovenste navigatie, een felblauwe call-to-action-knop en Chinese tekst." }, { "title": "9. Visuele achtergrond", "position": "Onderaan volledige breedte", "count": 4, "labels": [ "Flowing ribbon background 1", "Swirl Rainbow", "Flowing ribbon background 2", "Radiant Crystal Burst" ], "visual": "Vier rechthoekige achtergrondvoorbeelden in paars, blauw en cyaan." } ], "footer": { "count": 1, "text": "Ontworpen met de natuur in gedachten, gemaakt voor beleving.", "center_icon": "Klein vlindericoontje" } }, "art_direction": { "materials": "Glasimitatie, neon-randverlichting, vloeiende kleurovergangen, subtiele reflecties", "colors": "Elektrisch blauw, indigo, violet, cyaan, wit", "composition": "De strakke rasterindeling omvat negen genummerde inhoudssecties, voldoende witruimte, slanke afgeronde randen en een dominante vlinderafbeelding.", "render_quality": "Zeer verfijnd, overzichtelijk, een premium designproject in Behance-stijl." } }