import{j as e,M as o}from"./index-vBUz_pj7.js";import{useMDXComponents as a}from"./index-Cu8ufBhu.js";import{T as r}from"./custom-title-docs-CLqgn0qR.js";import"./iframe-D2vpjhY5.js";import"./index-C__6K5js.js";import"./index-Bhqu_tAV.js";function t(n){const i={a:"a",blockquote:"blockquote",br:"br",h2:"h2",h4:"h4",li:"li",p:"p",strong:"strong",ul:"ul",...a(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(o,{title:"Getting Started/Intro"}),`
`,e.jsx(r,{title:"Benvenuti alla Piattaforma di Gestione Webkits di INAIL - WebKit 3.3",links:[{text:"Cos'è UI STORY?",href:"#cosè-ui-story"},{text:"Perché abbiamo scelto UI STORY?",href:"#perché-abbiamo-scelto-ui-story"},{text:"Gestione dei Webkits HTML e Component Library",href:"#gestione-dei-webkits-html-e-component-library"},{text:"Un Repository per UX e Brand Identity",href:"#un-repository-per-ux-e-brand-identity"},{text:"Vantaggi per lo Sviluppo e la Manutenzione",href:"#vantaggi-per-lo-sviluppo-e-la-manutenzione"},{text:"WebKit 3.3",href:"#webkit-33"}]}),`
`,e.jsxs(i.p,{children:["INAIL ha recentemente adottato ",e.jsx(i.strong,{children:"UI STORY"}),", uno strumento avanzato per gestire, documentare e collaborare sul WebKit 3.3 Questo passo mira a garantire efficienza, coerenza e un'elevata qualità del codice nei progetti web, migliorando anche l'esperienza utente (UX) e l'identità del brand."]}),`
`,e.jsx(i.h2,{id:"cosè-ui-story",children:"Cos'è UI STORY?"}),`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"UI STORY"})," è una piattaforma interattiva che consente di sviluppare, testare e documentare componenti di interfaccia utente in modo indipendente. Si integra perfettamente con i framework di sviluppo front-end come Angular, HTML e altri, offrendo un ambiente isolato dove i componenti possono essere visualizzati, testati e documentati in tempo reale, senza necessità di avviare l'intera applicazione."]}),`
`,e.jsx(i.h2,{id:"perché-abbiamo-scelto-ui-story",children:"Perché abbiamo scelto UI STORY?"}),`
`,e.jsxs(i.p,{children:["L'adozione di ",e.jsx(i.strong,{children:"UI STORY"})," in INAIL risponde a diverse esigenze strategiche:"]}),`
`,e.jsxs(i.ul,{children:[`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Coerenza e riutilizzabilità"}),": Con UI STORY, possiamo creare una libreria di componenti visivi facilmente riutilizzabili nei vari progetti, garantendo uniformità nel design e nel comportamento delle interfacce web."]}),`
`]}),`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Repository per documentazione UX e Brand Identity"}),": Oltre alla gestione dei componenti tecnici, UI STORY funge da repository centrale per la documentazione delle linee guida UX (User Experience) e dell'identità del brand. In questo modo, tutti i team possono accedere a linee guida chiare e aggiornate su come strutturare l'interfaccia utente, rispettando sia gli standard di accessibilità che i principi visivi del marchio INAIL."]}),`
`]}),`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Collaborazione semplificata"}),": Designer, sviluppatori e stakeholder possono interagire facilmente con i componenti tramite UI STORY. Grazie alla documentazione UX e Brand Identity integrata, sarà più semplice mantenere coerenza visiva e funzionale tra i vari progetti."]}),`
`]}),`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Testing e documentazione efficaci"}),": UI STORY consente di testare i componenti in un ambiente sicuro e isolato, visualizzando diverse varianti e stati. Questo non solo migliora la qualità del codice, ma fornisce anche una documentazione interattiva sempre aggiornata."]}),`
`]}),`
`]}),`
`,e.jsx(i.h2,{id:"gestione-dei-webkits-html-e-component-library",children:"Gestione dei Webkits HTML e Component Library"}),`
`,e.jsx(i.p,{children:"La piattaforma di gestione INAIL integra Webkits sviluppati con HTML e Component Library, due tecnologie fondamentali per le nostre interfacce."}),`
`,e.jsxs(i.ul,{children:[`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Webkits HTML"}),": Grazie a UI STORY, i componenti HTML sono organizzati in una libreria facilmente accessibile. Questo permette agli sviluppatori di visualizzare e testare i componenti singolarmente, verificando che siano conformi agli standard di design, accessibilità e funzionalità."]}),`
`]}),`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Component Library"}),":  UI STORY facilita la gestione di componenti dinamici e modulari. Gli sviluppatori possono testare le interazioni tra i componenti, visualizzare gli stati interattivi e assicurarsi che il comportamento sia conforme ai requisiti di UX e Brand Identity."]}),`
`]}),`
`]}),`
`,e.jsx(i.h2,{id:"un-repository-per-ux-e-brand-identity",children:"Un Repository per UX e Brand Identity"}),`
`,e.jsxs(i.p,{children:["Una delle novità più significative introdotte con ",e.jsx(i.strong,{children:"UI STORY"})," è la sua funzione di repository per la documentazione relativa a UX e Brand Identity. Questo significa che le linee guida su come progettare l'interfaccia utente e mantenere l'identità visiva del brand INAIL saranno integrate direttamente nella piattaforma, accessibili in tempo reale da chiunque lavori ai progetti web."]}),`
`,e.jsxs(i.ul,{children:[`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Documentazione UX"}),": UI STORY ospiterà le linee guida relative all'esperienza utente, facilitando la progettazione di interfacce intuitive e accessibili. I principi di design centrati sull'utente saranno chiaramente definiti, consentendo ai team di mantenere elevati standard di usabilità."]}),`
`]}),`
`,e.jsxs(i.li,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Documentazione Brand Identity"}),": Le regole visive e stilistiche che definiscono l'immagine di INAIL saranno facilmente accessibili tramite UI STORY. Questo assicura che tutti i progetti web rispettino le linee guida del brand, mantenendo coerenza in termini di colori, tipografie e layout."]}),`
`]}),`
`]}),`
`,e.jsx(i.h2,{id:"vantaggi-per-lo-sviluppo-e-la-manutenzione",children:"Vantaggi per lo Sviluppo e la Manutenzione"}),`
`,e.jsxs(i.p,{children:["L'adozione di ",e.jsx(i.strong,{children:"UI STORY"})," offre una serie di vantaggi chiave:"]}),`
`,e.jsxs(i.ul,{children:[`
`,e.jsxs(i.li,{children:[e.jsx(i.strong,{children:"Riduzione degli errori"}),": Una chiara visualizzazione di ciascun componente semplifica il processo di debugging e correzione degli errori."]}),`
`,e.jsxs(i.li,{children:[e.jsx(i.strong,{children:"Incremento della produttività"}),": I componenti possono essere creati una sola volta e riutilizzati in più progetti, risparmiando tempo e risorse e garantendo uniformità."]}),`
`,e.jsxs(i.li,{children:[e.jsx(i.strong,{children:"Collaborazione migliorata"}),": UI STORY promuove la collaborazione tra designer e sviluppatori, grazie a una documentazione completa e accessibile su UX e Brand Identity."]}),`
`]}),`
`,e.jsxs(i.blockquote,{children:[`
`,e.jsxs(i.p,{children:[e.jsx(i.strong,{children:"Nota"}),": UI STORY è basato su StoryBook, una piattaforma Open Source ampiamente riconosciuta per la gestione di componenti UI."]}),`
`]}),`
`,e.jsx(i.h2,{id:"webkit-33",children:"WebKit 3.3"}),`
`,e.jsxs(i.p,{children:["Il Webkit 3.3.0 è stato rilasciato e certificato in data ",e.jsx(i.strong,{children:"21/10/2022"})," e le relative risorse statiche rilasciate su alcuni domini Inail tramite virtual directory condivise. Il richiamo e l'utilizzo di tali risorse è specificato all'interno delle linee guida di integrazione ",e.jsx(i.a,{href:"https://collaboration.inail.it/dc/dcsit/sviluppoapplicativo/dwork/SitePages/Pagina%20iniziale.aspx?RootFolder=%2Fdc%2Fdcsit%2Fsviluppoapplicativo%2Fdwork%2FDocumenti%20condivisi%2F400%20Integrazione%20%28INT%29&FolderCTID=0x012000927AD53C997CB34A819EE01E425A61E0",rel:"nofollow",children:"DCOD_SSIT_LGd_IntegrazioneWebappPortaleUnico"}),"."]}),`
`,e.jsx(i.p,{children:"Per le applicazioni sviluppate dopo tale data, devono considerarsi obbligatorie le indicazioni contenute nelle relative linee guida. Per le applicazioni sviluppate in data antecedente, si consiglia la progressiva adozione della versione di Webkit più recente, ed il ricorso alla deroga con rientro per la pianificazione della attività."}),`
`,e.jsx(i.p,{children:"La versione più recente di linee guida sostituisce tutte le precedenti."}),`
`,e.jsx(i.h4,{id:"retrocompatibilità",children:"Retrocompatibilità"}),`
`,e.jsxs(i.p,{children:["Se non specificatamente indicato, le risorse rilasciate nel Webkit, sono compatibili con le versioni precedenti.",e.jsx(i.br,{}),`
`,"In caso di necessità, in fase di certificazione del software sviluppato, è possibile comunicare all'ufficio competente la versione del Webkit a cui si è fatto riferimento."]}),`
`,e.jsxs(i.p,{children:["È ammessa quindi l'aderenza ad una versione del Webkit precedente rispetto a quella in vigore, considerando opportunamente il periodo di inizio degli sviluppi e la versione del Webkit vigente in tale periodo. Come riferimento per lo storico delle versioni, è possibile fare riferimento alla pagina ",e.jsx(i.a,{href:"changelog.html",children:"Versioni"}),"."]})]})}function m(n={}){const{wrapper:i}={...a(),...n.components};return i?e.jsx(i,{...n,children:e.jsx(t,{...n})}):t(n)}export{m as default};
