M-Tel's website
Redesigning the site of Bulgaria’s largest telecom was one of the greatest challenges we have ever encountered. It was both a great chance and great responsibility – to test our creativity, process and skills and to meet up to all expectations for a fabulous new site.
Now that a few months have passed since the launch of the new site Melon is pleased to see a great increase in SEO and user satisfaction.
A recent poll conducted by M-tel shows ninety three percent user satisfactions. Sixty percent of the participants said the new site exceeded their expectations. The site was rated 5.20 on a 1 to 6 scale. Not surprisingly the site won the Website of the Year Award in Technology and Communications in the prestigious Bulgarian Web Awards Competition organized by the Bulgarian Web Association.
We are pleased to see that our hard work and tough decisions help the site become the primary destination for all M-tel clients -- current and future.
The new website
Looking at the outcome we realize that we’ve managed to achieve our primary goal -- introduce substantial improvements while taking care not to introduce any changes that would detract from existing successes – a balance not easy to maintain.
The challenge
The project was defined as a redesign of M-tel ’s current site. If we try to put in one sole sentence what this actually meant it will go like this: analyze the current site, discover all user needs, come up with a new site structure, establish and optimize all user experiences/flows, create prototype, build new web identity, implement it, test it, fine-tune it, test it again, and ultimately end up with an useful and exciting web destination one would want to visit. Again.
In addition we had to keep in mind two complex processes that run simultaneously and intertwined with our work – M-tel were in the process of introducing a new visual identity system, and at the same time switching to a new billing system. As a result we had to make decisions based on hints and work in progress.
Last but not least, even though not directly stated, the new website was expected to act as both a vanguard channel for the introduction of the new visual identity and a spectacular web interface for a vast array of extras meant to revitalize customer satisfaction.
New Structure and Navigation:
Having several competing user experiences made the task quite tricky. We had to keep the individual identity of each experience while at the same time make all experiences work seamlessly.
On one hand there was the "core" experience which served as a global overview and guide to the assortment of telco services. On the other there was a separate "store" experience for those who wished to check latest offerings and buy online. Then we had the “entertainment” experience where users could view and download plenty of entertainment content – from ringtones and music to games and applications.
The challenge was to combine all these into a natural navigation flow but yet preserve the unique identities of the individual navigation streams.
New design:
There were also plenty of design-specific challenges to the project as well. The key design goals were to facilitate the new structure and navigation and make the site simpler and cleaner, allowing the content to shine through the brand new packaging.
M-tel had a well-established brand solidified by years of heavy campaigning. However, at that particular moment, they had just started revisiting their visual identity. Working on the edge of both the current and the new amorphous identity models while trying to keep visual consistency and not to dilute the user experience was yet another test for our creativity.
For a period of six months we created, focus-group tested and refined a number of look, feel and manner concepts only to extract the finest ideas.
Look and feel
Site Audit
We did a site audit of all current functionalities and requirements. A big telecom site with a ten-year history like M-tel .bg had tons of content to dig and requirements to keep in mind. However, the real challenge was to be innovative and yet remain within the framework of the specific business requirements laid out for us by M-tel.
Competitive Analysis
We analyzed the industry finest sites and figured out what they were doing well, and where things could be better. We found plenty of inspiration for features and techniques that could truly enhance the M-tel experience.
Features and functionality matrix
Once all analysis was done, we continued with documenting every desired feature, functionality and design for the new site. Features were ranked by importance and grouped into appropriate phases. Decisions here were greatly assisted with guidance from the M-tel team.
Information Architecture
A project of enormous scale such as this one was an excellent chance to put to test not only our production but also our project management capabilities. Applying Agile project management principles we conducted a series of regular meetings with all M-tel departments to trace all site-related needs and information channels. When consensus was reached on requirements, we documented and laid everything out in black and white wireframes. Creating wireframes for all pages is a technique we use in all our projects. It allows focusing the discussion on structure and strategy without getting distracted by colors, typography and other “polish” details. This technique also helps identify weaknesses in flows and thinking, and serves as a great tool to make mid-flight adjustments along the way.
Wireframes
Design
The adoption of Agile helped us out during this phase again. Our creative team worked closely with M-tel during the design stage to ensure the brand identity of the site was consistent with all offline elements as well. We conducted a series of regular meetings during this phase, face-to-face, to guarantee all business goals were met and every need was accounted for in the final design.
Development
Melon worked closely with M-tel ’s development team to bring the initiative to life. While the front-end was completely re-architected by Melon, M-tel had to integrate with their existing back-end architecture to complete the build. Because the front-end is composed of several interwoven components, Melon took special care to clearly communicate with M-tel about all the relevant functionality.
The Result
Working with M-tel was a great learning experience. For one, we greatly improved our approach to analyzing, evaluating and systemizing user data which greatly impacts the overall strategy and approach. We learned how to work with huge amounts of content and how to leverage swift navigation and loading HTML techniques to ensure the user feels a distinct sense of performance while eased and guided through the complex site structure. We were able to design some tricky features such as the myriad of product and plan calculators and came up with innovative ways to market multiple product and service lines. The end product is a smartly designed and easy to navigate telecom website that we feel is one of the industry’s finest.