Miejski Serwis Informacyjny
Projekt dla Urzędu Miasta GliwiceMiejski Portal to wizytówka miasta i pierwszy punkt kontaktu pomiędzy samorządem a inwestorami, turystami i mieszkańcami. Dowiedz się, jak zaprojektowaliśmy nowy portal oraz jakie korzyści dla samorządów oferuje technologia Drupal.
Problem
Dotychczasowe problemy Miejskiego Serwisu Internetowego można opisać w ramach przestarzałej technologii. Po pierwsze, poprzednia strona nie była responsywna, co negatywnie wpływało na UX użytkowników urządzeń mobilnych, odwiedzających portal z urządzeń takich jak smartfony i tablety. Dla ilustracji można powiedzieć, że osoba odwiedzająca dawny Miejski Serwis Internetowy z urządzenia mobilnego dostawała rendering strony przeznaczonej na komputery stacjonarne – czyli wersję desktopową.
Wersja desktopowa, choć jest idealnie dostosowana do ekranów wysokiej rozdzielczości, jest przeznaczona do obsługi myszką, co oznacza, że cechuje ją duża ilość małych linków, przycisków i innych funkcjonalności, które są wywoływane przez precyzyjne kliknięcie myszką. Mimo tego, że znaczna część nowoczesnych urządzeń mobilnych również posiada ekrany wysokiej rozdzielczości, urządzenia mobilne z zasady nie posiadają precyzyjnego narzędzia do wybierania i aktywowania funkcji. To narzędzie jest zastąpione ekranem dotykowym, który jak wiadomo, nie jest bardzo precyzyjny.
W wyniku tej nieprecyzyjności ekranów dotykowych, mimo faktu, że posiadają one taką samą lub zbliżoną rozdzielczość do ekranów komputerów stacjonarnych, interfejs musi być „uproszczony”. Uproszczenie polega m.in. na zwiększeniu rozmiaru niektórych przycisków, pionowy rendering lub interfejs oparty na przewijaniu contentu, potocznie nazywany scrollowaniem.
Drugim problemem przestarzałej technologii był sam back-end portalu. Biorąc pod uwagę fakt, że portal został stworzony kilka lat wcześniej, odpowiadał standardom ówczesnego internetu. Choć niektóre serwisy i strony internetowe oparte na technologiach CMS pozwalają na podążanie z duchem czasu poprzez aktualizacje, nie zawsze jest to technicznie możliwe.
Dla przykładu przestarzałe wtyczki lub niezgodność ze standardami kodu często uniemożliwiają łatwą aktualizację, powodując błędy w renderingu lub funkcjonalności po tak zwanym „upgrade”. Jak można się spodziewać, kilka lat progresu w internecie jest odpowiedzialnych za fundamentalne zmiany w sposobie, w jaki strony funkcjonują. Nowoczesne strony używają kompresji grafiki i kodu, mechanizmy przyspieszenia ładowania oraz korzystają z rozbudowanych funkcjonalności najnowszych przeglądarek Firefox i Chrome. Niestety, z racji przestarzałej technologii ówczesny portal miejski nie mógł skorzystać z wyżej wymienionych nowoczesnych rozwiązań. Dla użytkownika końcowego oznaczało to bardzo wolny rendering strony jak na dzisiejsze czasy. Za to dla portalu świadczyło to o spadkach w rankingu SEO, podyktowany polityką Google faworyzującą szybkie i responsywne strony internetowe.
Trzecim problemem była sama szata graficzna, która już nie odpowiadała dzisiejszym trendom internetowym. Biorąc pod uwagę fakt, że portal jest w pewnym sensie wirtualną wizytówką miasta, racjonalne jest zadbanie o profesjonalizm w przedstawieniu miasta i możliwości, które ono oferuje. Niestety, poprzednia wersja strony internetowej nawet przy zmianie szaty graficznej po prostu była oparta na dawnych założeniach szablonowych, które dziś są uważane za passe. Biorąc to pod uwagę, prosty lifting szaty graficznej nie byłby wystarczający – portal wymagał zupełnie nowej, nowoczesnej koncepcji.
Nasze rozwiązanie
Miejski Serwis Internetowy wymagał fundamentalnych zmian – i takie wprowadziliśmy, przysłowiowo zaczynając od zera.
Zaczęliśmy od wdrożenia nowego projektu graficznego z wersją responsywną, jako bezpośrednie rozwiązanie problemu dotyczącego użytkowników urządzeń mobilnych. Po pierwsze, w nowej wersji portalu każdy użytkownik, niezależnie od urządzenia, którym się posługuj, dostaje idealnie dopasowaną stronę internetową. Po drugie, strona jest responsywna, co znaczy, że content i grafika zawsze wyglądają poprawnie i skalują się do rozmiaru i rozdzielczości ekranu.
Responsywność również oznacza fakt, że z punktu widzenia back-endu aktualizowana jest jedna strona internetowa, a nie dwie, oddzielne strony internetowe, jak wcześniej. Po trzecie, według polityki Google i innych wyszukiwarek internetowych, strony poprawnie renderujące się na wszystkich urządzeniach mobilnych silnie zyskują na pozycjonowaniu.
W drugiej kolejności rozbudowaliśmy Portal o dwa nowe podserwisy: Kultura i Turystyka. Bazując na przekonaniu, że każdy z serwisów i podserwisów prawdopodobnie będzie redagowany przez zupełnie inne zespoły, stworzyliśmy rozwiązanie, w którym zarządzanie wszystkimi serwisami i podserwisami odbywa się z jednego, spójnego panelu. Do korzyści wynikających z takiego rozwiązania możemy zaliczyć jednolitość UI, która pozwala na szybkie zrozumienie wszystkich serwisów na podstawie jednego interfejsu oraz skróconą ilość szkoleń, które muszą przechodzić osoby aktualizujące stronę.
Ponadto wszelkiego rodzaju wsparcie techniczne jest oparte o ten sam interfejs, co pozwala osobom technicznym na uproszczone udzielanie pomocy. Co więcej, zarządzanie dostępem do odpowiednich funkcjonalności również jest z natury ułatwione, ponieważ jeden, centralny punk zarządzania dostępami do funkcjonalności zastępuje indywidualne instancje i skomplikowane uprawnienia dla każdego pracownika do każdego serwisu oddzielnie.
Poza wyżej wymienionymi zmianami w back-endzie, zintegrowaliśmy nowy portal z BIP – czyli Biuletynem Informacji Publicznej. W przypadku Miejskiego Serwisu Internetowego Gliwic integracja polegała na tym, że informacje i dane są automatycznie pobierane z BIP i wyświetlane w ramach strony. Kontynuując zmiany w back-endzie, również dostosowaliśmy nowy portal do standardów WCAG 2.0 i W3C, oznacza to poprawną obsługę wysokiego kontrastu i powiększania czcionek, co jest bardzo istotne dla osób korzystających ze strony z wadą wzroku.
Back-end nie kończy się na samej platformie CMS, ale także obejmuje serwery i technologie, na której CMS funkcjonuje. Biorąc pod uwagę fakt, że nowy portal dla miasta jest oparty o open-sourcową technologię Drupal 7, przystosowaliśmy ten CMS specyficznie do najnowszych wersji PHP 7.2, do bazy danych MySQL 5.7 oraz serwera http Apache w wersji 2.4.
Dlaczego Drupal?
Drupal należy do rozwiązań CMS bazujących na otwartym kodzie źródłowym („open source”). Dzięki temu Drupal oferuje wiele korzyści dla osób korzystających z tego systemu zarządzania treścią. Po pierwsze, otwarty kod źródłowy oznacza brak opłat za licencję. Osoby tworzące stronę, jak i administrator nie muszą wnosić opłat za wdrożenie i korzystanie z oprogramowania, ponadto korzystanie z oprogramowania nie jest limitowane w czasie. Po drugie, otwarty model kodu pozwala na bezpieczny audyt i dopisywanie dodatkowych funkcjonalności według życzenia właściciela strony lub portalu.
Przewagą Drupala nad innymi CMS-ami np. WordPressem jest szybkość i bezpieczeństwo stron internetowych, co tworzy z Drupala idealną platformę na potrzeby samorządów i instytucji publicznych, posiadających wiele poufnych danych i danych osobowych.
Szczegóły rozwiązania
Gdy celem projektu jest całkowita przebudowa i unowocześnienie wizerunku portalu miasta, back-endowe zmiany mogą nie wystarczyć. Aby umilić korzystanie z nowego Miejskiego Serwisu Internetowego dla użytkowników, zaprojektowaliśmy i wdrożyliśmy całkowicie nowy layout i szatę graficzną. Ponadto zaproponowaliśmy szereg rozwiązań, które spotkały się z aprobatą Urzędu Miasta Gliwice. Dla przykładu opracowaliśmy integrację z mapami Google, a następnie OpenStreetMap w celu stworzenia mapy z możliwością filtracji danych pobranych z instancji Drupala, co pozwala na bardzo ergonomiczną wizualizację informacji nałożonej na planie miasta.
Kolejnymi przykładami rozwiązań front-endowych jest rozbudowanie widoków wyświetlających wydarzenia z podziałem na miesiące, dodanie sondy wyborczej zliczającej automatycznie punkty oraz wdrożenie panoram 360, które świetnie ilustrują ofertę miasta.
Projekt w liczbach
specjalistów pracujących nad projektem: Project Manager, UX/UI Designer, 2 Drupal Developerów, Tester.
Na tworzenie strony poświęciliśmy około 600 godzin!
Strona powstała w 5 wersjach językowych.
Wdrożyliśmy 3 serwisy w ramach jednej platformy.
Efekty pracy
- Wdrożenie nowego projektu graficznego z wersją responsywną.
- Wdrożenie 2 nowych podserwisów: Kultura i Turystyka.
- Wdrożenie zarządzania podserwisami z jednego panelu.
- Integracja z mapami Google, a następnie Openstreetmap w celu stworzenia mapy z możliwością filtracji danych pobieranych z Drupala.
- Pobieranie informacji z kanału informacyjnego BIP.
- Rozbudowanie widoków wyświetlających wydarzenia z podziałem na miesiące.
- Dodanie sondy wyborczej zliczającej automatycznie punkty.
- Dostosowanie strony do standardów WCAG 2.0 i W3C (wysoki kontrast, powiększanie czcionek).
- Dostosowanie Drupala do najnowszych wersji PHP 7.2 oraz MySQL 5.7 na serwerze Apache 2.4.
- Wdrożenie panoram 360.
Technologie
Co możemy zrobić
Smartbees istnieje na polskim rynku od 2011 roku. Jesteśmy software housem specjalizującym się w tworzeniu stron internetowych, portali e-commerce, oraz aplikacji webowych. Posiadamy ponad 10 lat doświadczenia w realizacji projektów opartych o technologię Drupal oraz 5 lat doświadczenia w technologii Magento.
Naszym wyróżnikiem jest transparentność kodu, szczegółowa dokumentacja oraz gwarancja stabilnego, sprawnego działania projektów przez nas opracowanych. Wierzymy, że poprawny, przemyślany kod jest kluczem do długofalowej satysfakcji Klienta.
Projekty przez nas przygotowane oferują:
- szybkość i stabilność
- łatwość w aktualizacji
- ergonomiczność
- bezpieczeństwo danych
- długofalową możliwość rozbudowywania funkcjonalności
Korzystając z naszych usług, dajemy Ci pewność, że Twoja strona zostanie zaprojektowana w sposób przemyślany i pozwoli na łatwe aktualizacje i rozbudowywanie funkcjonalności – przez każdego - nie tylko nas.
Nasi Klienci
