Children's Medical Center «Do16-ti»

Website design, Drupal migration, and development for the children's medical center

About the company

“Do 16-ti" (translating as “Under sixteen years old”) is the children's medical center that has been providing children with high-quality medical services for more than 10 years. We were challenged to enhance the website’s work to let the staff focus on what’s really important - cultivating a healthy generation.

The project goals

The main visitors of the website are the parents who want to get the latest information about the clinic, doctors, prices, and services. Because of this, the website should be simple, user-friendly, and understandable for users who are not familiar with computer and the Internet.

We had several goals to accomplish:

  • To migrate the website from Drupal 6 to Drupal 7.
  • To migrate content.
  • To develop new features.
  • To rework the existing functionality.
  • To redesign the website and enhance UI/UX.
  • To make the web site responsive and mobile-friendly.

Let’s see what it took us to do.

Website design and UI

Before taking the big plunge and starting development, we worked on the website design. We created a brand new main page but kept its structure. The rest of pages were rebuilt with the help of UI-kit: read the block “Front-end development”.

Also, we made the website responsive and made sure it has a user-friendly UI. Remember that a big part of visitors are inexperienced users, and such features as the online appointment booking must have an intuitive design.

Another request from the client was creating custom illustrations for the slider at the main page. The slider has two versions: for desktop and for mobile devices. The illustrations are changed each season, and what’s especially cool is the fact that a content manager can change them without the developer’s help. The same applies to the banners on the website: the content manager is changing them herself.

Migration from Drupal 6 to Drupal 7

While the migration to Drupal 7 itself wasn’t anything special, the content migration was a delicate process. The thing is, when we started working, the website had about 30 000 active users, so we were required to migrate all the data and save the users’ content and passwords.

Together with the data migration, our goal was to improve an admin UI. We built several administration pages which allow to easily manage frequently changing content (ex. price lists) and export data in different files’ formats.

Another subgoal was to keep its high SEO rank after moving to Drupal 7, save all the URLs, etc.

Drupal 7 development

ADCI Solutions totally reworked the website and its functionality. We rebuilt the website’s structure and architecture. Also, the following features were redeveloped: the process of an online appointment booking, the history of visits, a personal account, and a gift card balance.

First of all, we integrated the website with the Intranet tools of the medical center so that the center’s staff could make a schedule and users could make the appointment to a doctor online. Of course, we paid a special attention to users privacy.

Secondly, the online appointment booking. We created a multistep form which consists of three steps:

  1. A user should select a department.
  2. The user selects a doctor, a clinic, and a convenient time for a visit. It's possible to have a look at a doctor's schedule up to 2 weeks ahead.
  3. The user checks contact information and chooses an appointment type. The user is also able to check the list of services and prices.

Thirdly, a lot of efforts were invested into the personal account development. There a user is able to:

  • add and edit personal information
  • add and edit information about his/her children
  • view tests results online. All tests results are private and protected. Every user can view only his/her children’s tests
  • view the history of medical visits
  • check the gift card balance
  • subscribe to the newsletter

And the last but not least, we made it possible for a content manager to create an advertising offer without the developers’ help: the manager can change the content blocks.

Front-end development

As we mentioned above, the UI-kit played a big role in the whole website redevelopment. Our web designer created a wonderful guide for front-end developers where she determined all the typography specifics (body text, links, headings), the specifics of UI elements (buttons, menus in the sidebar), etc. With its help the front-end developers managed to change the overall look of the website pages without any back-end works.

Also, ADCI Solutions actively adopts modern front-end technologies. For example, the page “Services and prices” (it is a cost calculator) was made with Angular JS 4.x. Other than that, PostCSS was used for the whole front-end part of works.

Conclusion

The works at the website are ongoing: we keep on designing, developing, and helping out with the email-newsletter. We also design all print production: banners, brochures, and leaflets. The medical center “Do 16-ti” sticks to the continuous improvement, so we strongly advise on doing the same and keeping an eye on your website constantly.

Cast

Profile picture for user zenkovets

Artyom Zenkovets

Team lead
Profile picture for user kuznetsov_sasha

Alexander Kuznetsov

Senior Developer
Profile picture for user shulgina

Tatiana Shulgina

Lead Designer
Profile picture for user chuchin

Dmitry Chuchin

Front-end Developer

Next case study

The 25th NSF EPSCoR Conference

Migration to Drupal, theming, and design for the Montana NSF EPSCoR Program