Execution of Kentico 8 Redesign
Kentico 8 has been released after having devoted three months of development time to a major redesign of its user interface. Let’s take a look at how Kentico 7 changed to Kentico 8.
Dedicating three months to implementing the UI redesign felt like quite a long time, so we decided to split it into three one-month-long milestones, which we called Minimal Marketable Products. Each of these milestones offered improvements over the previous version. Each MMP had to be “complete” i.e. could not contain any work-in-progress features. These rules helped us stay focused and also gave us clear deadlines so that we could have an idea of when we would have a version ready for presentations and usability tests.
The actual work on the UI redesign started on October 15th
. For the sake of comparison, here is the original state before the redesign was put in place.
At first, we added a new header with a User Menu on top of the application. We started with a process of removing unnecessary borders and gradients.
We wanted to remove the Ribbon toolbar, but it had to be done in small steps. Seen below is the first one, where we reorganized the header a bit and implemented the first version of the Application list.
End of MMP1: The Ribbon is no more
At the end of MMP1, we managed to remove the Ribbon toolbar completely and copied its navigation to the Application list. Also, from this point forward, it was possible to access the Site Manager’s applications from CMS Desk.
While we started working on the second milestone, MMP1 was introduced to selected partners on a webinar and underwent series of usability tests. This allowed us to quickly implement most of the feedback we received into the second and third milestones.
Application dashboard and new contextual help
At the beginning of MMP2 we built the very first version of the Application dashboard and the new contextual help. We also added a search box to the Application list, which greatly sped up the navigation around Kentico.
New icons, breadcrumbs and reorganized applications
In the next steps we updated the iconography in Kentico. Many icons were not necessary and were removed, while the rest got changed by brand new vector, font icons. Breadcrumbs were merged together and moved to the header, which increased the available screen space.
We also reorganized applications to a new, task oriented structure. That meant that we had to remove the Site Manager completely and with this done, we renamed CMS Desk to Administration, with /Admin as URL.
Apart from the new features, we updated several UI elements, such as inputs, buttons, and dialog windows; we also started reformatting the forms.
The big challenge was updating all of the typography. We knew we would not be able to change it all within a single MMP, so we did it iteratively with the whole redesign. We selected one element, for example the headers, and updated them. Then we moved to the paragraphs, and so on.
In the last milestone, we mainly improved what was already implemented and continued updating typography and forms. One big feature was the implementation of vertical tabs.
At the beginning, we did another round of usability testing as well as a webinar for selected partners. Since we felt quite confident with MMP2, we also posted a public blog post where we allowed everyone to download the preview version.
We wanted to distinguish applications by category, so we added colors to these as well as the Application list and Dashboard. We also started working on the vertical tabs, which gave us even more available screen space.
The rest of the MMP3 were mostly improvements and a finalization of the functionality. Here you can see the Application dashboard with a nice background, a refined Application list and some minor changes in typography.
… And done!
Here you can see the final version of Kentico 8. Apart from a ton of other small improvements, the Pages application got the final design and we added a Welcome tile to the Application dashboard, which should help new users with the basics.
Working on the redesign of Kentico was an incredible experience. It definitely couldn’t be done without such great cooperation between Kentico and our partners and customers. Thanks to you, we knew what needed to be fixed and we were able to get your opinions and suggestions on how to fix it.
Big thanks to everybody in Kentico! Your drive and full commitment to the whole redesign process was crucial.
Now it’s time for Kentico 8.1.
Find out more about Kentico redesign
This article is part of a series explaining how and why we redesigned the user interface in Kentico 8. Check out the rest of the articles from this series:
Introduction to Kentico 8 Redesign
New Application Structure
Behind new look and feel
Graphic principles of new UI
Design system and evaluation process of new UI