Un orgoglio aver potuto collaborare con Made in Cima, un'importante realtà italiana del web design.
Grazie alla collaborazione con Made In Cima, ho avuto l’opportunità di sviluppare la parte front end dell’applicativo web www.cosbi.eu. La parte più interessante e stimolante, è stata la creazione di numerose animazioni in "Vanilla" Javascript. Per quanto riguarda la struttura delle pagine e il suo aspetto ho utilizzato HTML 5.0 e SCSS [Sass], partendo da un design realizzato con Adobe XD.
CoSBi (computational and systems biology) é una joint venture tra Microsoft Research e l’Università di Trento, formata da un gruppo di ricercatori, sviluppatori ed analisti esperti in bioinformatica legata alla nutrizione, farmacologia dei sistemi ed all’ecologia, i quali hanno messo a punto il linguaggio di programmazione Blex, che permette di simulare e modellare i sistemi biochimici complessi.
Tecnologie
- HTML 5.0
- PHP
- SCSS [Sass]
- Vanilla Javascript
- Swiper JS
- Git [Bitbucket]
- Adobe XD
L'Animazione Grafica
Tra tutte le animazioni presenti su CoSBi.eu, quella più bella ma anche difficile da realizzare è stata ciò che ho chiamato "Graphics", un intreccio di linee e punti di diversi logotipi [© COSBI - Binomi design] che rappresentano le sezioni "What we do" di CoSBi. Per la realizzazione dell'animazione "Graphics" oltre a Javascript e relative classi, ho utilizzato la nota libreria Swiper JS.
-
Scientia extractionis
Officiis beatae eius quasi similique facilis repudiandae optio maxime neque nemo minima, cum provident quidem deserunt ullam debitis accusamus possimus nulla velit rerum autem impedit, illo ex dolorem harum. Cum placeat, pariatur, odio neque, recusandae id esse rerum minus officiis quaerat eligendi dolores ut architecto
-
Indicium integrationem
Quaerat dolores non distinctio, culpa at temporibus nesciunt voluptate. Dicta qui porro, neque sint hic quos nisi ducimus expedita assumenda officiis explicabo facilis magni velit veritatis culpa placeat nam veniam. Odit blanditiis a delectus ipsum itaque quo quae sint
-
Biologa idem
Possimus deserunt beatae recusandae officiis consequuntur natus odio nulla in dolore! Nulla vero labore similique tenetur maiores! Ullam illum neque iusto debitis! Consectetur laboriosam enim nesciunt vel illum, consequatur omnis tempore quisquam? Error quam deserunt omnis ea explicabo
-
Via integrationem
Ex in, dolorem dicta unde voluptatem illum harum eius deserunt! Quas reprehenderit natus blanditiis beatae alias rem quod possimus, fugit dolorum itaque. Et praesentium dolorum temporibus doloremque porro vero quasi debitis consectetur, illum
-
Examplum & simulae
Lorem ipsum dolor sit amet consectetur adipisicing elit. Labore aliquam harum, non nihil qui nesciunt, sapiente suscipit obcaecati, commodi porro soluta cumque aperiam corporis dolorem! Consectetur nam assumenda deserunt ad Lorem ipsum dolor sit, amet consectetur adipisicing elit. Facilis, qui error perspiciatis veritatis
Il Carosello
Il Carosello, conosciuto anche come Carousel, nel web design consiste in diversi elementi che scorrono orizzontalmente attraverso lo schermo fino a scomparire e riapparire dal lato opposto. Nella pagina Join Us di CoSBi, il carosello doveva scorrere senza fermarsi in maniera automatica.
La tecnica che ho adoperato è stata quella di duplicare ogni elemento in modo da averlo sempre visibile all'interno del Viewport. Nonostante, le numerose librerie disponibili per realizzare un "carosello", ho preferito creare questa animazione in maniera autonoma per rafforzare le mie conoscenze del linguaggio JavaScript.
