Nova web mòbil del Museu d’Història de Catalunya

Nova web mòbil del Museu d’Història de Catalunya

El projecte de web mòbil del Museu d’Història de Catalunya consisteix a traslladar a l'entorn específic de l’smartphone, de forma adequada, senzilla i eficaç, l'oferta museística i la informació més rellevant per a l'usuari a l'hora de realitzar la visita tant al museu com als monuments que s’hi adscriuen, amb l'objectiu d'augmentar les visites físiques.

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

 
Dades del client

Client: Museu d’Història de Catalunya
Categoria: Mobilitat, Lavert On line
Data: 31 Mar 2014

Fitxa tècnica

Solucions

Continuant la relació de col·laboració i assessorament en l'estratègia en línia que manté amb Lavert, el Museu d’Història de Catalunya, i atenent els resultats de les anàlisis i interpretació de les estadístiques d'accés al web, ens ha encarregat un nou web orientat a donar accés a l'oferta museística i a la informació sobre la visita des del telèfon mòbil, amb l'objectiu de millorar la seva experiència en la consulta de l'oferta cultural del museu.

La solució es basa en:

Una arquitectura de la informació senzilla i coherent que destaca la informació més rellevant, amb l'objectiu d'augmentar les visites físiques al museu.

Una navegació àgil i intuïtiva, la usabilitat de la qual millora de manera evident l'accés a la informació des del telèfon mòbil.

Un disseny especialment pensat per a dispositius mòbils que destaca visualment la informació més actual i important.

Un desenvolupament que s'adapta a qualsevol tipus de smartphone, ja sigui Android o iPhone, amb menús identificables per tots dos sistemes operatius.

Lavert ha dirigit i coordinat el projecte de forma integral, des de la conceptualització de l'arquitectura de la informació i la navegació, fins a la supervisió del disseny i el desenvolupament, i l'aportació de les solucions més apropiades als diferents requeriments que han anat sorgint.

Recursos

El sistema permet recuperar informació del web d'escriptori (per facilitar la gestió de continguts per part del museu) i mostrar l'oferta museística i la informació sobre la visita de forma adequada a les necessitats de l’usuari mòbil.

Compta amb un carrusel (slider) que destaca les exposicions que s'estan duent a terme en el museu, un apartat amb la informació per al visitant (horari, tarifes, com arribar-hi, etc.), un apartat sobre els serveis que disposa el museu, una agenda amb les exposicions i activitats presents i futures, i un apartat de Monuments adscrits al Museu d’Història de Catalunya.

L'apartat de Monuments recupera tota la informació que hi ha al web sobre cadascun dels monuments, compta amb un mapa de localització de tots els monuments i identifica els monuments més propers a l'usuari a través d'un sistema de geolocalització.

El web també mostra si el museu està obert o tancat en el moment en el qual l'usuari accedeix al web mòbil.

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; }