Introduction
The name iSTYLE probably doesn’t need any introduction as it’s the most prominent Apple Premium Reseller in Central Europe and in the Middle East. Besides its 5 stores and its active web presence (webshop, microsites, iMagazine) it’s known for its product-based educational and B2B services in Hungary. ISTYLE gained recognition as a distributor of Apple products, but other well-known brands are included in its portfolio, meaning that it has a whole ecosystem of Apple-compatible devices in its offering.
Specifics of the website and transitioning to Magento 2
iSTYLE is one of the longest-standing ecommerce clients of Oander, we’ve been working together collaboratively since 2014. Currently they are present in 9 countries and they are constantly expanding, meaning that iSTYLE has become one of the biggest Magento-based webshops in Central Europe. Delivering for the needs of certain markets is achieved through a single Magento installation, a webshop with a complex set of functionalities and external integrations.
When taking over the project five years ago, the site was running on Magento 1 which was a legacy codebase. Changing this code was done while transferring to Magento 2 in 2018. The transfer was carried out gradually, one webshop after another, meaning that for three quarters of a year we had to support two systems on top of developing 9 webshops with all the tasks this involved.
The parallel workflows required thorough organisation and careful planning, as the webshop often runs high-traffic campaigns (new Apple product or iPhone launches, Black Friday promotions). For this we had to deliver a strongly performance optimised codebase – that by the way performed very well in the campaign period of 2018 but required standby support.
The marriage of online and offline retail
Those who are familiar with iSTYLE know that besides its online presence, the company is very strong offline as well. When working with such clients synchronising the two in a multichannel way is crucial. While transitioning to Magento 2 the webshop had to be prepared for managing several stocks all at once, simultaneously, for aggregating and recalculating constantly changing stock data and for building business logics based on stock availability. The interoperable connections between online and offline retail are supported by a number of modules (journeys for example can start from either side and they can end both online or offline). The objective of this is that business practices support each other.
Agile methodology
The transition in 2018 and the full system support afterwards were based on an agile methodology, and we apply the same approach for current developments too. The development process that goes hand in hand with this methodology accommodated for quick and iterative release cycles, in which the client actively participates in. As part of the introduction of the Scrum framework, the client was educated and prepared to be able to adapt an agile approach, so a lot of methodology workshops were held along the way. Thanks to this, the iSTYLE team developed a preference for the Scrum methodology, they now see its advantages and they make use of it successfully.
Key stakeholders of the project join the members of our development team every other week for demo presentations, they plan together, and they often groom together as well. Thanks to thinking and planning collaboratively and to our dedicated team, a day-to-day relationship has been established between the client and Oander.
Besides the developments, Oander acts as a consultant as well. We brainstorm together with the clients, we specify the tasks, we manage the backlog and based on the agile methodology we rearrange priorities. As the project is running in an international environment (involving country managers, members of the sales team and webshop admins) it is challenging for all, who participate. The agile methodology helps with this though as it can accommodate for rapidly-changing demands coming from different places in a flexible way.
An example for the changing demands and their immediate implementation is constant monitoring: heatmapping and GA analysis link back to products and they help improving them further. Feedback that gets missed from the analysis create constant new demands or they override existing ones, that can be solved with the support of the agile methodology.
Magento module development
Transitioning to Magento 2 meant the updating of functions and business processes used in Magento 1 too. These demands were not lost during the process, so they became part of the MVP stage, during which dozens of complex and unique modules were developed. Today, the webshop features 120 Magento modules, some used as generic functions, some catering for local needs and business practices.
Nearly half of the modules were developed and installed by Oander, and the other half meant the installation of third-party modules. Implementing and finetuning these externally developed modules were challenging on such a scale, but the process proved the advantages of an open-source system, as it accommodates for a wide range of special functions to be used. And the demands for these functions are high with this project: individual countries have their own market-specific requirements. As an example, dozens of payment and shipping method integrations have to run on the webshop simultaneously.
Besides the third-party modules, the webshop works with a lot of unique business practices so we had to develop quite a few modules. Most of these support the commercial transactions, but we’ve also developed Magento modules that assist with internal corporate processes or modules with customer service relations. Modules that are used for automated processes were also very important (banner system, product recommendations, automated service processes).
The biggest module developments and the greatest challenges:
- Creating a module system that follows iSTYLE’s stock management logics meant the extension of Magento’s functionalities. As a result, instead of one global stock, products can be managed separately, based on warehouses or store-views. This module eliminates Magento’s native stock management logics and introduces a new, more complex one that uses calculations with which multiple stocks can be assigned to one single product. These unique calculations trickle down the whole shopping process of the website.
- We were requested to develop a pre-order function that featured ERP and CRM integration as well. This function makes it possible to place orders on products that are currently not in stock. This function makes it easier to manage such orders, it makes the process more comfortable for the customer and we can save some time for the webshop administrators as well.
- With the same ERP and CRM integration we made it possible to book appointments online for repair services. The booking platform is displayed with Magento and the module manages the synchronisation of internal logistics between the endpoints.
- As the result of the extensive market presence, displaying the prices on the sites are based on unique and individual market-specific logic and practices. It was a challenge to develop the configurable product attributes of Magento further, so that it lives up to Apple-specific standards and it was also challenging to do this simultaneously for 9 countries bearing in mind their local standards and industry requirements.
- During the project we put an emphasis on performance. With this a wide range of code optimisations were implemented (frontend and backend cache, database indexing processes, CDN, the introduction of lazy load, external hosted search solutions). The client was expecting the creation of an ultra-fast (almost real-time) and safe integration system that accommodates for heavy dataflow between external sources and the webshops.
UX design and template development
The ergonomic structure of the iSTYLE webshop was built on Oander’s Hodor template, but it has its own design, that greatly differs from Hodor’s original one. The update was preceded by serious ergonomic planning carried out by Oander, while the UI design was delivered by the client themselves. Transitioning to M2 didn’t put an end to the renewal though: the template evolves constantly as a result of optimisation. Besides traditional HTML / CSS, it features Vue.js solutions as well, reaching far beyond Magento’s standard frontend functionality sets in many different ways.
An interesting aspect of the website’s user experience is that certain product types have very specific layouts, making the template even more complex. These product pages act not only as traditional trading tools, but they are also elaborate landing pages for product groups with banners, calculators, content and design elements required by Apple specifically. As new products are constantly added and unique campaigns are launched often we had to create a flexible template that can easily be enriched with landing pages that might not have been planned for originally. These are now often designed and implemented on the site by the client, utilising the override options of Magento.
System integrations
As mentioned earlier, there are 9 webshops integrated closely with dozens of external sources. The integrations started after workshopping and estimating the business processes. The development was carried out in an agile methodology, during which the unique integrational requirements were developed alongside the websites.
As a result, all markets have their own ERP installation, meaning that each website within the same installation runs separately but under the same corporate management system technology. The webshop of iSTYLE is integrated with the ERP of its wholesale partner as well as their webshop. On the same note, a CRM integration was implemented as well with which transactional data, customer details and affiliate and loyalty information are shared between systems, not to mention the pre-orders that also happen here.
The integrational processes behind the webshop are carried out by our middleware product called OANDER Connect. The task of this middleware is to manage and make stock movements easily expandable and to synchronise orders, products and customer details. With its help software (such as the webshop, ERP, CRM, etc) are not directly connected to each other, they are linked to a central hub instead.
The integration on Magento’s side is provided by a ready-made module package called API Gateway. With this we can load the data that’s necessary for the running of the webshop quickly and efficiently, whether we’re talking about products, stock information or prices linked to them, but we can also parameterise individual basket pricing rules with it as well.
Operation
Given the vast extent of the project and the number of constant, high-traffic marketing campaigns, operation was a hot topic during the renewal. After examining the options carefully, we chose Amazon Web Service (AWS) while operational services and monitoring are carried out for iSTYLE by Eldacon, the market leader in cloud-based infrastructure solutions. We take advantage of AWS’s features, so that during campaigns and based on traffic the infrastructure can be scaled up to multiple times of the webshops own capacity in a flexible way. This is a very exciting opportunity, especially during product launches and Black Friday promotions.