Wrocławski Uniwersytet Medyczny
Jedna z najlepszych polskich uczelni medycznychPoznaj szczegóły powstania nowej strony internetowej dla UMW na Drupalu 9, którą wyróżnia intuicyjność, przejrzystość, wydajność i wysoki poziom bezpieczeństwa.
Problem
UMW od wielu lat prowadził stronę internetową na systemie Drupal 7. Jednak z biegiem czasu technologia stała się przestarzała i naturalną decyzją była migracja do najnowszej wersji Drupala, aby zachować najwyższe standardy kodu, bezpieczeństwa czy zadbać o usability serwisu.
Jedną z głównym bolączek starej wersji strony były problemy z UX. Przestarzały design, nieczytelna struktura i nawigacja czy brak dostosowania do urządzeń mobilnych powodowały, że strona była nieintuicyjna dla użytkowników, a jej obsługa z poziomu tabletów czy telefonów wyraźnie utrudniona. Aby sprostać oczekiwaniom użytkowników, konieczne były zmiany zarówno w zakresie technologii, jak i całkowity redesign serwisu.
Nasze rozwiązanie
Nasz zespół był odpowiedzialny za stworzenie od podstaw nowej witryny dla UMW na Drupalu 9. Prace obejmowały również wdrożenie nowych, estetycznych projektów graficznych, które zostały stworzone zgodnie z najlepszymi standardami UX/UI.
Nowa witryna zawiera częściowo odwzorowane funkcjonalności, które znajdowały się na starej stronie zbudowanej na Drupalu 7. Wdrożyliśmy także wiele nowych funkcjonalności zgodnie z wymaganiami klienta, które rozwinęły zakres działania witryny i poprawiły wrażenia użytkowników. Ważnym elementem projektu była również migracja treści, o której piszemy nieco więcej w dalszej części case study.
Po zakończonych pracach programistycznych i licznych testach zajęliśmy się wydaniem witryny w środowisku produkcyjnym. W tej fazie projektu położyliśmy nacisk na zweryfikowanie wydajności i szybkości działania systemu poprzez szczegółową analizę użytych komponentów i usług.
Po przeprowadzeniu analizy i wyciągnięciu wniosków wdrożyliśmy mechanizmy, które ulepszyły system pod tym kątem (m.in. lazy loading, optymalizację plików graficznych, czcionek i stylów).
Następnym krokiem było przeprowadzenie wewnętrznego audytu bezpieczeństwa, dzięki któremu udoskonaliliśmy system również w tym aspekcie. Zajęliśmy się także przygotowaniem kompletnej dokumentacji: dostarczyliśmy szczegółową instrukcję korzystania z panelu administracyjnego, a także dokumentację wyjaśniającą szczegóły implementacji poszczególnych funkcjonalności.
Podczas całej współpracy byliśmy w ścisłym kontakcie z Klientem. Organizowaliśmy liczne spotkania kontrolne czy omawiające poszczególne funkcjonalności. W rezultacie Klient otrzymał dokładnie taki projekt, jakiego oczekiwał.
Szczegóły rozwiązania
Paragrafy
Całość projektu oparliśmy o model wykorzystujący paragrafy. Dzięki temu wszystkie podstrony są tworzone za pomocą dostępnych „klocków”, które można dowolnie układać, powielać czy zmieniać ich funkcjonalności w zależności od potrzeb. Paragrafy zapewniają dużą elastyczność w tworzeniu podstron i możliwość wprowadzania modyfikacji w wyglądzie czy treściach w przyszłości.
Dynamiczne tłumaczenie treści
Stworzyliśmy własny plugin do drupalowego edytora treści – CKEditora, który umożliwia dynamiczne tłumaczenie treści z języka polskiego na język angielski bez konieczności przełączania się w innej karcie do translatora DeepL. Tłumaczenia tworzy się na poziomie edytora treści.
Migracja treści
Ważną częścią prac programistycznych było przeprowadzenie migracji treści z aktualnych systemów klienta. Zadanie to skomplikował fakt, że treści znajdowały się w dwóch różnych CMS-ach, a także decyzja o przeniesieniu tylko wybranych treści z obu systemów. Aby rozwiązać problem, stworzyliśmy zaawansowany mechanizm migracji oparty na Migrate API, który na podstawie określonych warunków przetwarzał i migrował treści z obu systemów do nowej witryny.
Integracja z LDAP
Przeprowadziliśmy kompleksową integrację z LDAP (Lightweight Directory Access Protocol). Dzięki niej użytkownicy mają możliwość logowania się za pomocą danych z zewnętrznego systemu CAS (Centralnego Systemu Autoryzacji) dostarczanego przez klienta. Dużą zaletą tego rozwiązania jest fakt, że raz zarejestrowany użytkownik może korzystać z tych samych danych w wielu usługach.
Edytor obrazów
Z pomocą biblioteki TOAST UI wdrożyliśmy edytor obrazów, który umożliwia podstawową obróbkę plików graficznych z poziomu panelu administracyjnego Drupala. Z wykorzystaniem edytora możliwe jest m.in. obracanie obrazów, odbicie lustrzane, przycinanie, skalowanie, a także wiele innych operacji, dzięki którym użytkownicy tworzący treści mogą w łatwy sposób dostosować obrazy do pożądanej formy.
Dynamiczne formularze
Z wykorzystaniem modułu Webform użytkownicy mogą tworzyć dynamiczne formularze np. służące do zapisów/rejestracji. Użytkownicy z odpowiednimi uprawnieniami mogą samodzielnie konfigurować ustawienia formularzy, pól itd. bez pomocy programistów.
Przeglądarka plików PDF
Nasz zespół stworzył specjalną przeglądarkę gazet uczelnianych, która umożliwia dostęp do pełnych wydań czasopism w formacie pdf. Rozwiązanie oparliśmy o bibliotekę JavaScript – PDF.js.
Projekt w liczbach
Poświęciliśmy ok. 1800 godzin na analizy, prace developerskie, spotkania i konsultacje z klientem.
Wdrożyliśmy ponad 135 wizualizacji graficznych (desktop/mobile).
Stworzyliśmy 22 customowe moduły specjalnie na potrzeby tego projektu.
8 specjalistów Smartbees pracowało nad pomyślną realizacją projektu.
Efekty pracy
- Najnowszą wersję systemu Drupal 9.
- Stronę świetnie dostosowaną do urządzeń mobilnych.
- Nowoczesny design, przejrzystą nawigację, które pozytywnie wpłyną na wrażenia użytkowników.
- Wysoki poziom bezpieczeństwa potwierdzony przeprowadzonym audytem.
- Pełną dokumentację rozwiązania wraz z instrukcjami obsługi kluczowych funkcjonalności.
- Gwarancję wydajności, którą potwierdziliśmy podczas fazy testowej.
- Dostosowanie do wymagań WCAG 2.1 AA.