Miejski Serwis Informacyjny

Projekt dla Urz─Ödu Miasta Gliwice

Miejski 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.

miasto-gliwice
1
Problem
Zobacz
2
Nasze rozwi─ůzanie
Zobacz
3
Szczeg├│┼éy rozwi─ůzania
Zobacz
4
Projekt w liczbach
Zobacz
5
Efekty pracy
Zobacz
6
Technologie
Zobacz

Problem

dlaczego nawi─ůzali┼Ťmy wsp├│┼éprac─Ö?

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.

miasto-gliwice-www

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

jak─ů strategi─Ö zastosowali┼Ťmy?

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.

panorama-miasto-gliwice

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?

Zalety dla serwis├│w miejskich

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.

drupal-logo

Szczeg├│┼éy rozwi─ůzania

jakie obszary okazały się kluczowe?
serwis-informacyjny-gliwice-wersja-mobilna

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

czyli statystyki realizacji
0

specjalist├│w pracuj─ůcych nad projektem: Project Manager, UX/UI Designer, 2 Drupal Developer├│w, Tester.

0

Na tworzenie strony po┼Ťwi─Öcili┼Ťmy oko┼éo 600 godzin!

0

Strona powstała w 5 wersjach językowych.

0

Wdro┼╝yli┼Ťmy 3 serwisy w ramach jednej platformy.

strona-internetowa-miasta-gliwice

Efekty pracy

co zyskał nasz Klient?
  1. Wdro┼╝enie nowego projektu graficznego z wersj─ů responsywn─ů.
  2. Wdro┼╝enie 2 nowych podserwis├│w: Kultura i Turystyka.
  3. Wdro┼╝enie zarz─ůdzania podserwisami z jednego panelu.
  4. Integracja z mapami Google, a nast─Öpnie Openstreetmap w celu stworzenia mapy z mo┼╝liwo┼Ťci─ů filtracji danych pobieranych z Drupala.
  5. Pobieranie informacji z kanału informacyjnego BIP.
  6. Rozbudowanie widok├│w wy┼Ťwietlaj─ůcych wydarzenia z podzia┼éem na miesi─ůce.
  7. Dodanie sondy wyborczej zliczaj─ůcej automatycznie punkty.
  8. Dostosowanie strony do standard├│w WCAG 2.0 i W3C (wysoki kontrast, powi─Ökszanie czcionek).
  9. Dostosowanie Drupala do najnowszych wersji PHP 7.2 oraz MySQL 5.7 na serwerze Apache 2.4.
  10. Wdro┼╝enie panoram 360.

Technologie

kt├│re wykorzystali┼Ťmy

Co mo┼╝emy zrobi─ç

dla Ciebie i Twojej firmy?

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

co o nas m├│wi─ů?
Panek S.A.
Wyższe Szkoły Bankowe
Unicef
Urzad Miasta Gliwice
Akademia Leona Koźmińskiego
Tomasz Zbierski
Dyrektor IT / TAI

Smartbees wykaza┼é si─Ö sporym do┼Ťwiadczeniem w zakresie systemu CMS Drupal i bardzo pom├│g┼é nam w modernizacji naszego serwisu przetargowego.

Łukasz Filut
Dyrektor IT / WSB

Partnerskie podej┼Ťcie firmy sprawia, ┼╝e nasza wsp├│┼épraca uk┼éada si─Ö bardzo dobrze i ch─Ötnie zlecamy nowe zadania.

Mateusz Tomczak
Specjalista ds marketing / VELO

S─ů dobrzy w nawi─ůzywaniu silnych relacji biznesowych z klientami.

Szybka wycena

Zbuduj sw├│j projekt z Smartbees
Dostaniesz wycen─Ö w ci─ůgu 24 godzin