Catalunya i la Guerra de Successió (1702-1715)

Catalunya i la Guerra de Successió (1702-1715)

L'exposició online “Catalunya i la Guerra de Successió (1702-1715)” és la translació a l'entorn online/multidispositiu de l'exposició “Catalunya i la Guerra de Successió (1702 – 1715)”, realitzada pel Museu d’Història de Catalunya. Aquesta exposició transmet el conflicte internacional que va suposar la proclamació de Felip V per la monarquia espanyola, així com les conseqüències de la seva victòria: la dura repressió i l'abolició de les constitucions catalanes i la fi de l'Estat Català.

Aquesta experiència on line es pot veure aquí.

Dades del client

Client: Museu d’Història de Catalunya
Categoria: Projectes on line, Lavert On line
Data: 30 des. 2013

Fitxa tècnica

Solucions

Continuant la relació d'assessorament en estratègia online que Lavert manté amb el MHCAT, aquest ha encarregat, amb motiu de la celebració del Tricentenari, la digitalització de l'exposició “Catalunya i la Guerra de Successió (1702 – 1715)”, realitzada en el Museu del 17 d'octubre de 2007 al 20 de gener de 2008.

Creació d'una arquitectura de la informació que permet una visita fàcil, intuïtiva i eficaç entre els continguts, destacant amb gran detall els més rellevants.

Direcció de la definició dels wireframes, navegació i usabilitat del projecte online a partir del guió expositiu de l'exposició física per transmetre fidelment el concepte en l'entorn online.

Direcció del disseny de la interfície per contextualitzar de forma gràfica l'exposició en línia i destacar de forma adequada els continguts més representatius.

Coordinació del desenvolupament per aportar les solucions més apropiades als requeriments que han anat sorgint.

Recursos

Els àmbits i els subàmbits estan il·lustrats a partir de les imatges dels materials expositius de l'exposició: objectes, quadres, gravats, dibuixos, estendards, etc.

Des del punt de vista tècnic s'ha utilitzat tecnologia HTML5 per dotar d'interactivitat suficient al projecte i uns CSS “responsive” perquè l'exposició online es pugui veure correctament des de qualsevol dispositiu (ordinador de sobretaula, iPad o tablet i smartphone).

També s'ha utilitzat Javascript per a les diferents funcionalitats de l'exposició en línia.

Col·laboradors:

àtica studio

Microblau

Projectes relacionats
input:focus, select:focus, textarea:focus { border-color: #046a38; } a { color: #046a38; } .radio i, .checkbox i { color: #046a38; } .radio i:before { background-color: #046a38; } .button, .btn-default { border-color: #046a38; background-color: #046a38; } .button:hover { color: #046a38; } .page-header-top { background-color: #046a38; } .page-header-bottom-alt { background-color: #046a38; } .page-intro:after { background-color: #046a38; } .page-intro:before { background-color: #046a38; } .page-content-section-bg { background-color: #046a38; } .page-content-section-bg:before { background-color: #046a38; } .page-content-section-border { border-top-color: #046a38; } .page-footer { background-color: #046a38; } .block-head-1 { border-bottom-color: #046a38; } .block-head-1 i { background-color: #046a38; } .block-head-2:after { background-color: #046a38; } .block-head-2 i:after, .block-head-2 i:before { background-color: #046a38; } .block-head-3 { border-bottom-color: #046a38; } .block-head-3 i:after { background-color: #046a38; } .block-head-4:after { background-color: #046a38; } .block-head-7 { border-bottom-color: #046a38; } .block-head-7:after { background-color: #046a38; } .page-content-section-bg .block-head-3 i { color: #046a38; } .main-search button { color: #046a38; } .main-search button:after { background: #046a38; } .main-nav li a { color: #046a38; } .main-nav li a:before { background-color: #046a38; } .main-nav li ul { background-color: #046a38; } .main-nav li li:hover > a, .main-nav li li.active > a, #block-newsletter-newsletter-subscribe .form-submit:hover, .block-product-details .add-wishlist .button-alt:hover, .block-product-details-2 .add-wishlist .button-alt:hover { color: #046a38; } .main-nav .switcher { border-color: #046a38; background-color: #046a38; } .main-nav .mega > div { background-color: #046a38; } #block-newsletter-newsletter-subscribe .form-submit, .btn-primary:hover, .btn-primary:focus, .btn-primary:active { border-color: #046a38; background-color: #046a38; } .art-portfolio ol li.active, .ui-slider-horizontal .ui-slider-handle, .ui-slider-horizontal .ui-slider-range, .btn-primary.link { background-color: #046a38; } .btn-primary, .button:hover, .btn-default:hover, .btn-default:focus, .btn-default:active { border-color: #046a38; color: #046a38; } .btn-primary.link:hover, .btn-primary.link:focus, .btn-primary.link:active { color: #046a38; } } @media screen and (max-width: 767px) { /* phone */ .main-nav ul { background-color: #046a38; } .main-nav li a { color: #ecf0f1; } .main-nav li ul { background: #e9e9e9; } .main-nav li li { border-top-color: #046a38; } .main-nav li li a { color: #046a38; } .main-nav li li a:hover { background-color: #046a38; color: #fff; } .main-nav li li ul { border-top-color: #046a38; } .main-nav .mega ul li { border-top-color: #046a38; } } .slider-revolution .fa:after { background-color: #046a38; } .slider-revolution .title { border-top-color: 1px solid #046a38; border-bottom-color: 1px solid #046a38; } .slider-revolution .button-my { border-color: #046a38; background-color: #046a38; } .slider-revolution .button-my:hover { color: #046a38; } .pagination-1 a:hover { border-color: #046a38; color: #046a38; } .pagination-1 .active, .pagination-1 .active:hover { border-color: #046a38; background: #046a38; } .pagination-2 a:hover { color: #046a38; } .pagination-2 .active, .pagination-2 .active:hover { background: #046a38; } .pagination-3 a:before { box-shadow: inset 0 0 0 1px #046a38; } .pagination-3 .active:before, .pagination-3 .active:hover:before { background: #046a38; } .pagination-4 a:hover { border-color: #046a38; } .pagination-4 .active { border-color: #046a38; background: #046a38; } .pagination-5 a { border-color: #046a38; background-color: #046a38; color: #046a38; } .block-benefits div:hover { border-color: #046a38; background-color: #046a38; } .block-benefits i { color: #046a38; } .block-benefits-2 li i { color: #046a38; } .block-benefits-2 .tabs a:hover { border-color: #046a38; background-color: #046a38; } .block-benefits-2 .tabs .active a, .block-benefits-2 .tabs .active a:hover { color: #046a38; } .block-benefits-3 i { color: #046a38; } .block-about .button { border-color: #046a38; color: #046a38; } .block-about .button:hover { background: #046a38; color: #ecf0f1; } .block-about .owl-prev:hover, .block-about .owl-next:hover { color: #046a38; } .block-about-2 .bar { background: #046a38; } .block-about-2 .value { color: #046a38; } .block-about-4 .owl-pagination div { border-color: #046a38; background: #046a38; } .block-about-5 .owl-prev, .block-about-5 .owl-next { display: inline-block; border-color: #046a38; background-color: #046a38; } .block-about-5 .owl-prev:hover, .block-about-5 .owl-next:hover { color: #046a38; } .block-about-6 .icons a:hover { color: #046a38; } .block-mission .year { background: #046a38; } .block-mission .years a:after { border-bottom-color: #046a38; } .block-recent-works ol li:hover { color: #046a38; } .block-recent-works ol .active { border-color: #046a38; background: #046a38; } .block-recent-works .description { background: #046a38; } .block-recent-works .description:before { border-right-color: #046a38; } .block-recent-works-3 h3 { border-top-color: #046a38; } .block-recent-works-3 .link { border-color: #046a38; } .block-recent-works-3 .fancybox { background-color: #046a38; } .block-recent-works-3 .owl-pagination div { border-color: #046a38; background: #046a38; } .block-recent-works-4:before { background: #046a38; } .block-recent-works-4 .fancybox { background: #046a38; } .block-recent-works-4 .owl-prev:hover, .block-recent-works-4 .owl-next:hover { color: #046a38; } .block-recent-works-6 a:before { background: #046a38; } .block-recent-works-6 .owl-prev, .block-recent-works-6 .owl-next { border-color: #046a38; background: #046a38; } .block-recent-works-6 .owl-prev:hover, .block-recent-works-6 .owl-next:hover { color: #046a38; } .block-portfolio ol li:hover { color: #046a38; } .block-portfolio ol li.active { border-bottom-color: #046a38; } .block-portfolio ul .pic span:after, .block-portfolio ul .pic span:before { background: #046a38; } .block-portfolio ul .pic span i { color: #046a38; } .block-portfolio-2 ol li:hover { color: #046a38; } .block-portfolio-2 ol li.active { background: #046a38; } .block-portfolio-2 ul .pic:before { background: #046a38; } .block-portfolio-2 ul .pic a { background: #046a38; } .block-portfolio-2 ul .pic a:hover { color: #046a38; } .block-portfolio-3 ol li:hover { color: #046a38; } .block-portfolio-3 ol li.active { background: #046a38; } .block-portfolio-4 h3 { border-top-color: #046a38; } .block-portfolio-4 .link { border-color: #046a38; } .block-portfolio-4 .fancybox { background: #046a38; } .block-portfolio-5 ol li:hover { color: #046a38; } .block-portfolio-5 ol li.active { background: #046a38; } .block-portfolio-5 .info:before { background: #046a38; } .block-portfolio-6 ol li:hover { color: #046a38; } .block-portfolio-6 ol li.active { background: #046a38; } .block-portfolio-6 ul a:before { background: #046a38; } .block-portfolio-7 ol li:hover { color: #046a38; } .block-portfolio-7 ol li.active { background: #046a38; } .block-portfolio-7 ul li:before { background: #046a38; } .block-portfolio-7 ul a:hover { color: #046a38; } .block-portfolio-8 li div:before { background: #046a38; } .block-portfolio-8 li a { background: #046a38; } .block-clients .owl-prev, .block-clients .owl-next { color: #046a38; } .block-testimonials-3 .carousel h3 { border-bottom-color: #046a38; } .block-testimonials-3 .owl-pagination div { border-color: #046a38; } .block-testimonials-3 .owl-pagination .active { background: #046a38; } .block-testimonials-4 .owl-prev, .block-testimonials-4 .owl-next { border-color: #046a38; background: #046a38; } .block-testimonials-4 .owl-prev:hover, .block-testimonials-4 .owl-next:hover { color: #046a38; } .block-services li a { border-color: #046a38; } .block-services li a:hover { background-color: #046a38; } .block-services-2 li a:hover { background: none; } .block-services-2 li a:after { box-shadow: inset 0 0 0 2px #046a38; } .block-services-2 li a:hover:after { background-color: #046a38; } .block-services-3 li a:hover { background: none; } .block-services-3 li a:after { box-shadow: inset 0 0 0 2px #046a38; } .block-services-3 li a:before { background: #046a38; box-shadow: inset 0 0 0 2px #046a38; } .block-services-3 li a:hover:after { background-color: #046a38; } .block-services-4 li a { border-color: #046a38; } .block-services-4 li a:hover { background-color: #046a38; } .block-services-5 li i { color: #046a38; } .block-services-5 li i:hover { background: #046a38; } .block-services-6 h3 span { color: #046a38; } .block-services-6 li a { border-color: #046a38; background: #046a38; } .block-services-6 li a:hover { color: #046a38; } .block-services-7 .info i { background: #046a38; } .block-services-7 .carousel .active { background: #046a38; } .block-services-7 .carousel .owl-prev, .block-services-7 .carousel .owl-next { border-color: #046a38; background: #046a38; } .block-services-7 .carousel .owl-prev:hover, .block-services-7 .carousel .owl-next:hover { color: #046a38; } .block-pricing dt { color: #046a38; } .block-pricing .price:before { background: #046a38; } .block-pricing li:hover .inner { background: #046a38; } .block-pricing li:hover .button { color: #046a38; } .block-pricing li:hover .button:hover { background: #046a38; } .page-content-section .block-pricing .inner { box-shadow: 0 0 0 1px #046a38; } .block-pricing-2 dt { color: #046a38; } .block-pricing-2 .price { background: #046a38; } .block-pricing-2 .button { color: #046a38; } .block-pricing-2 li:hover .inner { background: #046a38; } .block-pricing-2 li:hover .button:hover { background: #046a38; } .block-progress li i { border-color: #046a38; color: #046a38; } .block-team-2 .pic:before { background-color: #046a38; } .block-team-2 .icons a { color: #046a38; } .block-team-3 .pic:before { background-color: #046a38; } .block-team-3 .icons a { color: #046a38; } .block-team-3 .info h3 { color: #046a38; } .block-team-list .pic span:after { background-color: #046a38; } .block-team-list .icons a:hover { color: #046a38; } .block-team-list .icons a:before { background: #046a38; } .block-team-list .skills { border-top-color: #046a38; border-bottom-color: #046a38; } .block-team-grid .pic:before { background-color: #046a38; } .block-skills i:before { background-color: #046a38; } .block-skills .bar { border-color: #046a38; background-color: #046a38; } .block-skills-2 i:before { background-color: #046a38; } .block-skills-2 .bar { border-color: #046a38; background-color: #046a38; } .block-capabilities h3 { color: #046a38; } .block-capabilities-2 h3 { color: #046a38; } .block-recent-posts .info { background-color: #046a38; } .block-recent-posts-2:before { background-color: #046a38; } .block-recent-posts-2 li .button { color: #046a38; } .block-recent-posts-2 li .button:hover { background-color: #046a38; } .block-recent-posts-2 .button-more { color: #046a38; } .block-recent-posts-2 .button-more:hover { background-color: #046a38; } .block-featured-posts .pic:before { background-color: #046a38; } .block-blog-list .link { background: #046a38; } .block-blog-list .date:before { background-color: #046a38; } .block-blog-list .date-alt { background-color: #046a38; } .block-blog-list .zoom { background-color: #046a38; } .block-blog-grid .link { background: #046a38; } .block-blog-grid .date:before { background-color: #046a38; } .block-blog-grid .pic:hover .date { color: #046a38; } .block-blog-grid .zoom { color: #046a38; } .block-blog-details .date:before, .block-blog-details .reply:before, .block-blog-details .type:before { background-color: #046a38; } .block-blog-details .date-alt { background-color: #046a38; } .block-blog-details .share a:before { border-color: #046a38; background: #046a38; } .block-blog-details .share a:hover { color: #046a38; } .block-blog-details .about:before { background: #046a38; } .block-catalog-toolbar .view a:hover { border-color: #046a38; color: #046a38; } .block-catalog-toolbar .view .active, .block-catalog-toolbar .view .active:hover { border-color: #046a38; background: #046a38; } .block-catalog-toolbar .direction { border-color: #046a38; background: #046a38; } .block-catalog-toolbar .direction:hover { color: #046a38; } .block-catalog-grid .pic:before { background: #046a38; } .block-catalog-grid .badge { background: #046a38; } .block-catalog-grid .price { color: #046a38; } .block-catalog-grid .owl-prev, .block-catalog-grid .owl-next { border-color: #046a38; background: #046a38; } .block-catalog-grid .owl-prev:hover, .block-catalog-grid .owl-next:hover { color: #046a38;; } .block-catalog-list .pic:after { background-color: #046a38; } .block-catalog-list .badge:before { background-color: #046a38; } .block-catalog-list .price { color: #046a38; } .block-catalog-list .owl-prev, .block-catalog-list .owl-next { border-color: #046a38; background-color: #046a38; } .block-catalog-list .owl-prev:hover, .block-catalog-list .owl-next:hover { color: #046a38;; } .block-product-details .price { color: #046a38; } .block-product-details .button-alt { color: #046a38; } .block-product-details-2 .button-alt { color: #046a38; } .block-product-details-2 .share a:before { background-color: #046a38; box-shadow: 0 0 0 2px #046a38; } .block-product-details-2 .share a:hover { color: #046a38; } .block-product-info .owl-prev, .block-product-info .owl-next { border-color: #046a38; background-color: #046a38; } .block-product-info .owl-prev:hover, .block-product-info .owl-next:hover { color: #046a38; } .block-product-tabs .head .active { color: #046a38; } .block-product-tabs .head .active:before { border-top-color: #046a38; } .block-shopping-cart th { border-top-color: #046a38; color: #046a38; } .block-shopping-cart .price { color: #046a38; } .block-shopping-cart .remove { border-color: #046a38; background-color: #046a38; } .block-shopping-cart .remove:hover { color: #046a38; } .block-shopping-cart .quantity a { color: #046a38; } .block-shopping-cart .empty td { border-bottom-color: #046a38; } .block-shopping-cart-totals dd { color: #046a38; } .block-shopping-cart-totals .button-alt { color: #046a38; } .block-checkout-order td:last-child { color: #046a38; } .block-checkout-payment label { color: #046a38; } .block-welcome .icons i:after { border-color: #046a38; background: #046a38; } .block-welcome .icons a:hover i { color: #046a38; } .block-pasteboard:before { background: #046a38; } .block-pasteboard .icons a:hover { color: #046a38; } .block-map-3 .block-head { color: #046a38; } .block-contacts ul li:after, .block-contacts ul li:before { border-color: #046a38; background-color: #046a38; } .block-contacts ul li:before { background-color: #fff; } .block-contacts ul li span { border-bottom-color: #046a38; } .block-contacts ul .active { color: #046a38; } .block-contacts ul .active:before { background-color: #046a38; } .block-contacts ol { border-top-color: #046a38; } .block-contacts ol li { color: #046a38; } .block-contacts ol li i:after { background-color: #046a38; } .block-feedback .message i, .block-feedback-2 .message i { color: #046a38; } .block-not-found h3 { color: #046a38; } .block-not-found .pic:before { background-color: #046a38; } .block-not-found .pic div:before { background-color: #046a38; } .block-not-found-2 .button { color: #046a38; } .block-not-found-2 .button:hover { background: #046a38; } .block-coming-soon li:before { background-color: #046a38; } .block-coming-soon-2 li:after { background-color: #046a38; } .widget-categories a:hover, .widget-categories a.active { color: #046a38; } .widget-top-posts a:hover { color: #046a38; } .widget-text hr { border-top-color: #046a38; } .widget-text em { color: #046a38; } .widget-archive a:hover, .widget-archive a.active { color: #046a38; } .widget-tags a:hover { color: #046a38; } .widget-categories-filter a:hover { color: #046a38; } .widget-categories-filter .active { color: #046a38; } .widget-categories-filter .active span { background-color: #046a38; } .widget-price-filter .ui-slider-range { background-color: #046a38; } .widget-price-filter .ui-slider-handle { background-color: #046a38; } .widget-color-filter .active:before { border-color: #046a38; } .widget-top-products .pic i { background-color: #046a38; } .main-nav ul { background-color: #046a38; }