 Hello everyone, I hope everybody's fine and didn't have too much Guinness yesterday night So we're here today, I was gonna present you a case today about a project we had the X release the couple of months ago So the goal is to of course present the client the project itself and then to present you all the Problems the clients addressed us and the solution we we propose to solve them so I'm Ronnie I work at ad-ex as a project manager and I was actually the manager in charge of this project So I think I'm the best person to present you this case today Before we started a few words about ad-ex. So we're a digital agency specialized in Drupal solution So we do only Drupal We do all kind of project multi-site media website e-commerce and of course internet We have large clients based in Europe And the large parents there have a couple of office in Europe and and since a couple of months We are starting to expanding this to them to the American market. So as a client. We're talking about today I presented a couple of logo here because it might be known as different names if you're from France You might know him as a Lagardeur travel retailer if you have visited like a couple of airports in Paris or in France You might have seen the buy Perry stores in Europe it's It's known as IA duty-free. So in Poland, Spain, Italy, etc. You will see IA duty-free stores In the United States you will see more paradise Lagardeur. So yeah, depending where you're located. The brand is a bit different But let's call it today IA so What's alias so? They they manage a lot of duty-free stores about 500 dispatch in four universes. So we have the Alcohol obviously tobacco gastronomy and history. We have all the sector of perfume and cosmetics we have all the specialties which are all the electronic devices and The last one is the fashion universe. So which is pretty big also the luxury luxury corners those stores covers about 222 airports over four continents So they have dispatch over 31 countries in the world mainly Europe, but also in Asia Like Singapore China in Australia in North America. So they are dispatched all over the world So the main the main business is is luxury commerce the major part of the business is luxury Like they have a couple of they own like their own luxury stores are your product even even Victoria's Secret and do about one billion revenue per year so All those stores are were managed previously by an internet Based on on x-weekly so for those who don't know x-weekly it's some to platform Platform to manage content so actually I don't really know why they use this solution To build their previous internet I Suppose that the the need was pretty small at the beginning and then it starts to grow up and grow up And then the solution was not adapted at all at the end So they started a new RFP To rebuild the brain new internet and actually the funny story about this RFP that It started with a cold cold from us. So we were not involved this RFP. So our our unique sales guy Called the company. He started to talk with the CTO and And and finally he understood that they are running this this new internet and we we try to to get to get involved in this RFP So we Accepted so they actually already started the RFP process, but they finally accepted to to to put it in the in the process and so we finally got shortlisted and We were facing actually two big companies with our CGI and site core. They were proposing their own solutions and our side, of course, we were proposing a Drupal as a Platform at that time we proposed Drupal 7 because Drupal 8 was not enough mature to build this kind of big projects And when we proposed Drupals, I actually loved it. Why? First of all for his flexibility and then most important as a cost. It was obviously Or come petit or whether much more expensive than us with their solution So finally we we got the project and And we we try to to address all the problems. So How we how we transformed all their Problems into into solutions the first problems they addressed us and actually the most important xwiki was not very comfortable to use so actually it was at a certain point not used at all and managers in the store started to To use emails instead of their internet. So everybody was overloaded with emails And what we call the contributors so the health waters the marketing purchase Communications teams are always sending informations to the source for example To an alcohol stores, I can send like an email saying, okay, please reply this merchandising plan in stores ABC Please put the renard champagne at the top of the stores. Please display the whiskey right here Please install a topler on stone. So all kind of informations those informations are Provided by the health quarter Too darkly to the store. So as xwiki was not used they were sending emails. So managers were overloaded and Loosing a lot of time as you know in the kind of business time is money Secondly when so It's it's actually first of all hard just to to get rid of all the emails to find all the useful information that they need to process and then it was also hard to answer to everybody to say, okay This was applied. This is was not done. This is in progress So emails was definitely not the good tool to use for this kind of communication. So Our UX experts built a brand new interface. Oh, it's very close to As you can see To email applications if you're familiar with mail or with Outlook even with Gmail you can see You can see at the left like all the the filters that you have we have A new speed and then the content displayed as a right. So I think at the first look you're not very See you taking picture or send the presentation after Noah's So the code so when you see this interface for the first time, you're not like very you're not lost Because yeah the managers so managers in stores we have people very young we have people Less young so it should be addressed to all kind of profile not only People between 30 and 40 years old So we have this this this news feed with infinite scroll system in the Center we have the main navigation at the top and at the Top right we have all the settings and actions as you can see You have all the Notifications so it's pretty close to for example Facebook. You have the notification as the top right You have all the settings as your small profile People understand actually the interface when they see it they understand that settings as at the top right My content is in the middle Left is using for filtering etc pretty interesting Actually here each each content we send is we call it in use It's actually it's actually an action can be either an action or an information sent to the stores So as I provide you the example before so applying a merchandising plan is kind of action It can be either. Okay. This is this renard champagne is We will apply the promotion of this renard so by to get three so all kind of actions that the stores need to set up directly for the interface actually one of the most important things that It was approved by the manager. So We we had during the project a couple of Ambassadors so people from the stores real managers involved in the project they were part of the workshop and then There was a final validator. So we obviously had a project manager on the client side But you know project manager is only in an interface between the the final clients and and the agency and I think one of the One of the Factor of this success is that the manager decided what they wanted to have so what was really helpful for them So they were involved. They were working with our UX expert. Actually, we visited a couple of stores in Paris in our two airports in Russia and Orly and we finally Got to this conclusion where? We have like this nice and for interface. We have all the notification systems all the interactions For example here. We have the content of Offer of a news we have so all the useful links Documents attached to the content we have the specific status for each content We have we can't assign and use to somebody we can attach a picture We can submit comments. So you have really all the useful information in Quickly accessible. I Will go deeper into the details a bit later about this is this interface other interface that we set up is like a calendar where we can have an overview of Another view of all the actions that you need to perform on a specific week because From time to time like before the managers didn't have like the vision on what they really need to do They for example here on a specific week they they can see that okay, for example on during the Christmas meet We are definitely overloaded. We have like 20 marketing operation to set up So we definitely need to to hire some people just for this period So it's very easy to them to see the amount of work they need to perform during a specific period Usually operation are sent to the stores like up to three months before they need to do them So they can anticipate the load and organize their team in a different way So this interface as well as was was built with With the managers and our UX experts Interesting thing is that we actually took a lot of time to build this because usually when a client Tell you you need a calendar So you think about something close to to Google calendar or something with a weekly daily your review But here is the need is a bit different. We don't need actually a daily calendar We don't need to know hours. We just need to see the concurrent events happening during specific wings and Expanded on a couple of wings work a couple of weeks the next point. I want to present you as a Notification system so in order to not lose the informations we implemented this notification system based on the specific events So for example When the managers receive the news they can assign it to somebody in his own team. So When people receive a news assigned to him, he will be notified When the news is done also he will get another notifications When somebody comment your news will get notification and when somebody answer your comments a bit similar to Facebook system You will also get notifications. So each time you're involved with somewhere in the internet, you know where to go And you do not lose any any information informations so We're sending data to the stores But also one of the problems we faced before is that The stores were receiving all the data from like everybody. So actually they didn't really know What data concerns our stores what data doesn't concern so so they were overloaded by a lot of content that it's not necessarily Useful for them. So again, they were losing time and we're not very efficient in their work So the problem is we addressed here is how how do we send that? information to only the concert person So we we started by studying their their business structure Which looks like something like this simplified version as you can see you have different level So the highest level is the country. So each organization is a country then you have different company In each country you have sales organization. You have a sports store platform, which is actually the airport Each airport you have a couple of terminal and then in each terminal you have a couple of stores So the store is the level the lowest level of our structure and the country is a higher level The idea here is was to to send a content just to a specific Specific scope so for example, I like to to send this information to all the stores in United States or I need to send those Content only to terminal to in Dublin or I need to send it to a specific store in Paris, for example to organize this we used organic groups module, which is a Available on Drupal org so very very easy here to set up like a scope of visibility based on on information that you use to set up so you set up like collections of content and then you address this content to somebody so On the left side you can see You can see a part of the Creation of the news so we have a specific block when we can address the content to somebody so you can select The scope or the level of scope you want to send the information and then you select like Okay, do I want to send it to a terminal? Do I want to send it to a store? Do I want to send it to a country? This structure is imported every day via an automatic interface so every night all the All the structures you re-import also on their side They have their BI whereas a they integrate all the new stores all the new setup and we import this directly every day on the other side on the right side, so you have a screenshot of a user profile so users are also imported automatically. It's a live synchronization We saw live synchronization with their active directory The and on each each user is assigned to a couple of stores So here is you as user is a manager so as manager is responsible of one of several stores in general up to four or five stores and here as each manager is assigned to stores and Content is assigned to stores or high-level then it's very easy to know which content to display for each store. So on the general interface each each Each managers filter filters a content per store and then they can see only the content that they are concerned by as we said We have like stores all over the world. So Problems was we need to roll out very quickly new stores new countries new new environments So actually with this architecture Opening in new stores is pretty easy. Actually, we don't have to do anything on the store is imported in Drupal So all the structure is actually only taxonomies. So on the taxonomies present in Drupal You can directly send content to it. So the only manual thing you need to do is in case we they open stores in a new country Well, we can obviously import the country taxonomy, but actually There is a specific rules that depend on countries countries have a currency and he has it has a Rounding rule. So according to each country, we have those different rounding rules for promotion calculation for I think Country's creation is manually and then on the current you set up by the by the client It's actually very easy. It's only quite a taxonomy term on the taxonomy term is set up We can directly import all the structures that belongs to this country Next point I want to address is a tracking of the informations So the contributors the people that marketing and purchasing I send informations to the stores But they do not get any feedback so when they were sending emails They didn't know like what's what was happening Besides so is Is the informations processed is it in progress? How many stores perform? My my actions was very hard to to get get rid of all these things and other point was to have like global KPI information on all the stores So Based on our interface. I presented quickly before but we have like a couple of status those status are Depending on on on each store. So actually for a specific news The status is different per store. So this is here. We did a custom development. We have table where we store all the All the status for for a given news And then the managers can directly say, okay, this news is not processed I'm processing it and or it's done It's actually pretty close to for example, if you're using backtrack your systems like red mine Jira or mantis For example, this system is pretty obvious. You just set up a status for your information You can assign it. So as a manager, I can assign my my information To somebody in my team so I have the filtered users according to my store and I can assign it to somebody of my team and then finally on the information is assigned to somebody and then Processed like here We can also attach a Picture like we call it the proof picture. For example, okay I we deployed this Marchedizing plans and the booth for Toblerone is ready. Here is the picture. They can see how it's set up So people directly for the health quarter See directly the results from the store. So with their iPad they take a picture and they attach it directly here on the auto That's what the the front of this part the manager's point of view from the back end point of view as the contributors have an overview of All the stores where they send the information. So here, for example, we send the We send the news to I don't know like 15 15 stores and I can see very quickly which store perform my action Which store did not which short is performing? I have like global KPI at the top to see like how many percentage of the stores processed my news And well here's not displayed but in case they attach an image they can you can also directly see the image here So you have a global on from overview on the on your information so You also have global KPI for the top management For example, you can see the number of news created per month per theme per universe You can see which stores are processing a lot of Informations which stores are not doing their job correctly. You can see which managers are reacting You're acting very quickly. So what are the people who? Who directly process the news and what are the people who need to to recall a couple of times to to get rid of your your your content? Another problem that we we had at the beginning Some stores doesn't have a physical location so They for example a lot of Lot of airports you have like some fashion Fashion stores will have like only a booth in the center of the airport They don't have like a real real store and the problem is with those stores is that they do not have like a Real connection internet they depend on the why the airport Wi-Fi And as you know this Wi-Fi you're really really sex It's it's quite it's quite complicated to to use it for for business purpose. So The idea first of all what they requested in the RFP is to have like an iPad an iPad application To to like to redo actually the same internet In order to to like get all the other content and and being able to access Internet without internet, well, and we actually convinced them to not go for this solution, but instead of this Instead of says to to use the same application So the same Drupal application and to use an offline layer so they can use it without internet connection Is there is multiple advantage actually the first one is obviously the cost you're developing only one application Having like another iOS application will cost much more money and much more time And the second one is of course, it's easier to maintain you have only only one application at the end So if you're for example familiar with Google Drive, probably I've already seen something like this at the top when you lose your connection You have like small mistakes and you lost your collection will try to reconnect after a couple of seconds or couple of minutes We use a small javascript library called HubSpot for this So it only tracks if you have a connection or if you don't have a connection And during a fly mode managers can do a couple of actions they can actually Read the content so all the content is accessible even if they don't have an internet connection So all the content is preloaded And the second one thing also perform actions that can change the store status They can insert a comment so they can do a couple of actions that will be sent to our database on they will get an internet connection So it's it's pretty comfortable to them. It's pretty transparent They know that they don't have internet, but once they will Recover connections or the actions are not lost They will be they will be they will say then and send to the to the to the platform So to build this We use two technologies actually used a HTML5 app cache For pre-caching content. So we implemented actually a couple of hooks To to preload a list of dynamic page for example, what it's actually a bit complicated to to offline all the internet but we can for example Preload like the last 200 and use the last 200 merchandising elements, etc. So we can preload a lot of content according to your store So we only download the content you're interested by And we combine this with index DB why index DB because It's not possible with app cache to to store adjax request. So as All our application is based on an adjax It's like we do not reload the page at each click All those adjax requests are are are preloaded directly in index DB well for the Implementation, so as I said we we preload a lot of a lot of content directly Directly in Drupal and store all the actions that that were done On that were done directly on the on the iPad So actually offline mode is only used by by the iPad application. It also works with desktop, but it's it's in general less useful And on the internet connection is recovered we We we send all of the information directly to the platform So it's kind of technology have also a couple of these inventions these advantages First one it doesn't work with basic authentication So if you have basic authentication, you will have to find a worker on so we had just this problem during During development as our environments are protected by basing basic authentication So one more ground you just to use IP filtering instead of basic authentication Second problem is the access denied page. So you can face a couple of issues if the page you're trying to To preload are not accessible for a specific user So we need to test that each each page is really accessible by this user here We have like complex visibility rules like these users can only access this news because he's affected to this store So you need to test all the all the access denied issues before before you preload all the cash Because actually on our side We have two way to build the cash when you visit the page You will you will add an element to the cash and the other ways of course to to preload all the elements And the last one is the multi-user So if you are connected as a specific user on your iPad and you'll log out and you log in with another user we had We had the issue where the first the second user were saying the content of the first user so here you make to make sure that You clean up your manifest file you clean up your index DB and at the log out of the application Last point I want to address here is the promotion. So our our platform is is used as As computing station. So actually that the previous platform as was also used as computing station They need to calculate all kind of promotions directly in their internet So previously they had Two real issues the first one was the process in order to Import and calculate promotion. They had to import three CSV file The first one was the product CSV file taken one was the price because you can have a couple of price per Product per store and the last one was finally the promotion for the promotion themselves So it was quite a long complex quite a longer process and complicated and the second issue was a performance So in general per promotions are inserted into the platform at the beginning of each month and we have like hundreds and hundreds of contributors Uploading content at the same moment in the platform Which goes actually big load because they were like doing complex operations In the platform which which like impact the performance So what we propose here is so Obviously, we always have this promotion CSV import file to import the promotion but In order to to remove them remove the products and price CSV in CSV files, we have that directly in interface with SAP where we we download we Where we download the products and the price For each promotion we start in Drupal And then we calculate directly the the promotions based on those price. So we have the life price Purchase price sales price directly from from SAP For the performance point of view, so we build an asynchronous import interface The goal here was to being able to Upload a lot of a lot of promotions without impacting the performance of the application. So once you you upload a File it's inserted in the queue. So using the QAP of Drupal and And the upload is done in an asynchronous mode. So you don't see the result directly your Your import will have a pending status and when it will be processed by the queue You will see for example and in progress and in progress status and then when it will be done You will get an email saying okay, your import is done. This is the results or everything was imported well Or we got the cup of errors. Please check the error files So this is pretty useful for the measures They just drop the files and then they will get an email later when the their Promotions are performed. So if there is a lot of people putting a lot of content at the same time It might take a couple of hours, but at the end everything is imported in a good way Another point is you can have a nice story of all the important files So you can see who uploaded what if I see my colleague already uploaded this I do not to re-upload it so I can see directly all the promotions uploaded by a specific Purchase person And I can filter by status. So I have a very detailed dashboard just to access all of the import We We have complex Promotion rules. So here is Smaller small like some examples. You have like basic discount. We have for example buy two get three we have Buy five products get ten percentage Discount on this product. So there is a couple of promotion rules that have been set up and our calculated life Directly by by the platform So yeah, as as you can see the calculations are Calculations are done and stored directly during the import and the goal is being to to export actually all this data the contributors only use this platform to Calculate and then export the data of course the store can also see all the Promotion price directly from the stores and I have always the good information We have some time before switch to question So I was planning to do a smaller small live demo so we can see actually directly the Interface and take pictures a few more I will just try to share browser So let me start with this So as I described it before we have all the The filters at the left side you can Actually, it's not very comfortable for me one moment So as you can see on the left side you have all the filters so you can You can select the content of a specific theme All the content For a specific store so actually the store is a mandatory Is a mandatory filter you always need to select one store why because actually each content is displayed for a specific store So when I click on the content All the data so all this data is is displayed for a given store So the status is displayed for this store the people assigned to snooze is also displayed for this specific store As the comments and pictures so if I well If I change for example the status of this of this news to new to in progress And go to another store for example, what was this new item? You can see that for the same news here the status is different because it's another store So we have really Information based per per store then you have filters on universe filters on if you want to see only the new information the progress or the complete information as You have an outlook for example on or mail you have the filters or if you can filters by Publication date or application date on the news. So we have the title date Some images to illustrate the content attached document or links Small description This that is so news in progress or or or done you can You can attach You can attach the news to to somebody so I think there is nobody assigned to this to attach to the stores or isn't no people in my team and on Once the news is completed, then you can attach a picture It will be sent to the contributor to to say okay, we we perform the we perform the action We also have like small comments module at the end which is pretty useful for example I'm a contributor I sent an information to the store. Okay, please find attached as a merchandising plan And it can happen that people forget to attach attachment so Here's a manager would just say okay, for example. Yeah, you forgot Yeah, if you forgot the zero yes, you forgot the attachment, so please please put it in the content The The contributor will get out his notification and we'll be alerted that something is wrong in this information And he will be able to quickly react. So it's it's also be similar to Facebook. It's Really like a chat You can post comments and you can reply on the comments So we also have this Calendar module when you can see all the all the different information. So well here it's Pre-production environment. We have a lot of test informations You can see this for a specific week You can navigate from new week week and you can also go directly to a specific specific date Then we have a lot of other modules like the merchandising module, which is a Bit similar as the news module But here you can see all the the merchandising plan for a specific brand or specific universe for example if I like to check like all the fashion merchandising plan or for example all the Leak or merchandising plan here. I can see from all the cognac machine. I have all the All the file attached and I can directly Well get rid of the information And do what I want to do so here you can see like how the things need to be displayed in the stores Yeah, please put one one cognac here another brand here So all the information are explained directly in the PDF files and finally we have a playbook module It's like a general information for example Trainings well all content all kind of Global global information that are not specific to are not specifically in use so We always had the same interface with filters information and the detail of information But yet it's it's not to use From points can be useful links it can be whatever things on the internet This is also front of this part and from a backend point of view so you have a couple of dashboards So if you want If you want to see for example the import dashboards cause so somebody taking pictures before This is what looks like the import dashboards, so you have a freaking import here file Unsimploded you will you will get the status and then it will be processed by the queue So I can filter by status for example. I want to see all the all the All the import that error just to check what happens And then I can see the error logs to see what happened We have a couple of dashboards for example Yeah, it's pre-filtered by author. We have a couple of dashboards For the contributors from police is a dashboard with another view on all the news What is the useful information here is you can see to what did you send this information? And you can also I don't know if you see there is a percentage of people who processed this this information From qualified checks is well commerce October. I think that's 50% of the my scope Completed the news. Well, we can see that it was only addressed to two store And I click on it then I get the detail. Okay I know that this store process and information and and this one didn't and I know that the person was responsible of this action I can also show you the KPI. So we built a couple of KPI based on on news on users So you have as I said you get different formations that the times The times that people are taking to process information The number of information processed the number of information processed by months per universe So all those things are illustrated by each time a dashboard and and the small graph Small charges to see to see it in an easy way. So it's very easy then to create reports for their managers and Yeah, it's 1130. So I think that's it for the demo if you want to see specific things I can show you this a bit later. Now we have some some spare times of questions. So Feel free to ask me any questions that you like to have yet. Yeah Okay, so for the questions yet the first question. Yes, so To implement the scope of visibility we we use the organic groups module. So all our scope is actually only taxonomies Each level of our structure is taxonomy. So countries are taxonomy is towards a taxonomy And then we assign the same taxonomies to the user. So as the content is assigned to specific taxonomy and the user assigns taxonomy Then organic groups is able to build those permissions according to this So if a specific user is not assigned to store, he's not able to access the news and For the second questions So I didn't understand Yes, so this is just yeah, this is a views with the infinite infinite scroll All the so it's not an angle or GS interface. This is what was with questions. This is just Basic basic Ajax basic Ajax in in Drupal so This is the front end of Drupal all the all the Ajax are directly calling Drupal There is there is no rest or or angle or just behind this We have a thing about three three thousand users in total other question No, if there's something you need to see specifically in the interface Something you like me to to redo or well something you might be interested by Okay, thank you guys for your time and have a good day