För några dagar sedan tillkännagav AWS genom en publikation på sin officiella hemsida lanseringen av Cloudscape designsystem, en öppen källkodslösning för att bygga intuitiva webbapplikationer.
Cloudscape Design System består av en omfattande uppsättning riktlinjer för att bygga webbapplikationer, samt designresurser och front-end-komponenter för att påskynda implementeringen.
"Idag är vi glada över att kunna presentera Cloudscape Design System, en öppen källkodslösning för att skapa engagerande och inkluderande användarupplevelser i stor skala. molnlandskap
"Vi skapade den 2016 för att förbättra användarupplevelsen för AWS-webbapplikationer och även för att hjälpa team att distribuera dessa applikationer snabbare. Sedan dess har vi kontinuerligt förbättrat det baserat på kundfeedback och forskning”, säger AWS.
Om Cloudscape Design System
Molnlandskap är ett designsystem med öppen källkod för att bygga webbapplikationer för att förbättra användarupplevelsen i webbapplikationer som tillhör AWS-tjänster och även hjälpa team att distribuera dessa applikationer snabbare.
Varje komponent har en arbetsmiljö där designers och utvecklare kan se hur komponenten beter sig, samt exempelkod. För att spara tid och ansträngning när du skapar, ger AWS steg-för-steg-vägledning om tillgänglighetsalternativ och designlösningar.
När du skapar automatiserade tester för en applikation interagerar du med Cloudscape-komponenter. Du kan till exempel välja en Cloudscape-knapp och hävda att appen uppdateras för att återspegla den åtgärd du kopplade till den knappen. Den interna HTML-strukturen för Cloudscape-komponenter, inklusive CSS-klassnamn, kan ändras när som helst.
Det är därför AWS skapade testverktyg för varje komponent. Testverktygen har stabila API:er så att du kan komma åt relevanta delar av dessa komponenter utan att oroa dig för vilken väljare du ska använda. Cloudscapes testverktyg är ramoberoende och kan användas med vilken teststack som helst (från Jest och jsdom till WebdriverIO), samt följande:
- Enhetstester, där du vanligtvis har direktåtkomst till dokumentobjektmodellen (DOM)
- Integrationstestning, där det är typiskt att förlita sig på strängväljare. Testverktygen är en del av huvudkomponentpaketet.
- Ett urvalsfilter: som tillåter användare att hitta specifika objekt i en samling resurser genom att välja en eller två egenskaper.
- Behållare: Med behållaren kan du presentera en grupp innehållselement, vilket indikerar att elementen är relaterade. Till exempel är en array en typ av behållare.
- Expanderbart avsnitt: med det kan användare expandera eller komprimera ett avsnitt. Det rekommenderas att använda expanderbara sektioner när du har flera sektioner på en sida och vill tillåta användare att se en eller flera sektioner åt gången. Expanderbara avsnitt är komprimerade som standard.
- En åtkomstpunkt: I de praktiska handledningarna är hotspots osynliga behållare som markerar var hotspot-ikoner ska placeras. Hotspot-ikoner representeras av anteckningskontexten och används för att öppna och stänga anteckningspopups.
- Delad ruta: detta är en justerbar panel som ger tillgång till information eller sekundära kontroller. Detta är huvudkomponenten för att implementera delad vy, en mall för att visa en samling resurser med kontextuella resursdetaljer.
- Trollkarl: Ett flersidigt formulär som guidar användaren genom ett komplext flöde eller serie av sammanhängande uppgifter. En guide består av en navigeringsruta, en rubrik, ett huvudinnehållsområde och åtgärdsknappar.
Slutligen om du är intresserad av att veta mer om det, bör du veta att Cloudscape Design System skapades för och används av AWS produkter och tjänster. Det släpps som öppen källkod så att alla som bygger produkter i molnet kan dra nytta av AWS Design System.
Du kan kontrollera detaljerna i följande länk.