Let’s Reinvent Retail Together
I wanted to talk a little bit about the technologies that are involved in doing that. But before we do that, right, I want to try something a bit interesting. Okay, can we bring the house lights up just a bit as it goes? Hello. On your tables in front of you, everybody has an envelope with a sticker on it admonishing you not to open that envelope, okay?
Would you do me a favor and just open those envelopes and have a look what’s inside? The sound of ripping. Brilliant, let’s go, come on. Have a look. Okay, it’s four cards with four words written on them, some things that I want to talk to you about today, which is “reimagine, reinvent, re-engage, re-platform.” But we’re going to do something cool with these cards. Could you do me a massive favor and everybody just stand up? I know this is, whatever it is. But it would be very, very cool.
So, everybody has these cards in their hand. Everybody can see me, right? Everybody can see my hands? Everybody has the cards in their hands. What I want you to do is hold them facedown like this, and I want you to mix them by taking one card off the top and putting it to the bottom, like this. Facedown, Maurice, face down. It means this way, so you- Just keep doing that until you become completely bored and disinterested in the activity.
You’ve reached the point now where hopefully you have no idea what order those cards are in. They’re a completely random thing, right? Okay, this is a bit tricky with a card but we’re gonna try and do it. What you then do is you fold it in half this way, okay? Okay, everybody got that? This is the trickiest bit, okay? Nice big crease. Unfold it. Again, facedown. Even I’m fumbling. Then tear down the cards like that. Just tear without dropping. Brilliant. In your mind- No, I’m just kidding. Just tear.
You should now have some pieces in one hand and some pieces in the other hand, yes? Everybody good with this? You haven’t torn those cards, I can see that. Go for it. First choice, bunch of choices, you can either put these on top or underneath like that. Whatever you wanna do, put them on top or underneath and put them together until you end up with a pile of facedown pieces in your hand like this.
We’re gonna mix them again, same way. You take one piece off the top, you put it to the bottom, one piece off the top, you put it to the bottom, and you just do that as many times as you like. Brilliant. Done. Now, next tricky bit, take three pieces off the top. You’ve got three pieces in this hand. Okay, you got this? Put them any way you want in the middle. Just put them somewhere in the middle of the rest of the pieces. Slide them in. Everybody okay with this? Cool. The top piece, don’t look at it. Put it in your pocket but do not look at it. If you don’t have a pocket put it on the table, put it somewhere safe. Okay?
Now interesting stuff. Now bunch of random stuff. Basically, you can now take one, two, or three pieces, up to you. One, two, or three pieces, put them in the middle somewhere. Okay? The next piece on top, don’t look at it. Swap it with somebody. Get a piece of somebody else and you put that on top of your pile. See, it’s like networking with cardboard. It’s really great. Again, take one, two, or three pieces, shove them in the middle somewhere.
Okay, this is gonna be pretty random. Next piece, swap it with somebody. Maybe not the person you swapped it with last time. Just swap it with anybody. There we go. Put it back on top. For the final time, let’s put one or two pieces into the middle. Okay. This better work, right? This is the cool bit. What we do is we take the top piece and we put it on the bottom, take the next piece and throw it away. I’m gonna make a mess on the stage for Lee, unfortunately.
Next piece, put it to the bottom. Next piece, throw it away. You get the pattern of this. Next piece, put it on the bottom. Next piece, throw it away. Next piece on the bottom. Guess what? Throw it away. Next piece on the bottom. Next piece- There’s only so many ways you can say this and make it interesting. You get the idea. Next piece on the bottom. Next piece, throw it away. You should be left with one piece in your hand. Do not look at it. Don’t look at it. Get the thing that you saved, that you put in your pocket, and you saved. Don’t look at that.
Then turn them both over at the same time. The you go. There we go. You can all sit down. I should not do this. Actually, do you wanna drop the lights again for the- Yeah, brilliant. One of my favorite quotes by Arthur C. Clarke, which is, “Any sufficiently advanced technology is indistinguishable from magic.” It’s absolutely true. Absolutely true. I’ve made a bit of a mess. The things that you can do with digital technology these days is absolutely astounding. That’s what I wanna talk to you about, what we’re doing, where we’re going with this.
One of the things on the card is “reengage.” One of the things that we did was we started to think, “Well, what are we gonna do from a technology point of view?” We started listening to what our customers were saying, listening to what our partners were saying, and listening to what our developers were saying. We found out something interesting, which is that t-Retail is great. Isn’t that fantastic? But, and there’s always a “but,” it’s incredibly powerful. It’s very scalable. It has great connectivity. It has an incredibly powerful business.
But it’s complex. There’s a lot of configuration options in there. It’s a confusing interface. There is a learning curve to using it. The technology is fine, but it’s a bit old. There’s a lack of modern frameworks in there. The goal was, and this is a little bit Eurovision, there you go, was to get rid of two of those, stick with that, and build on what we’ve got. As Kieron said and mentioned where we are with t-Retailing over the last few years, when we talk about reinventing retail, we’re talking about reinventing technologies we’re using to do retail, as well.
That’s really what I wanted to talk to you about. The products that Kieron mentioned, all of these utilize and use new digital technologies. I’m not gonna go into too much detail, but I’m gonna go into some detail about what they are. We’ll go through some of the frameworks and some of the development methodologies we used to create these things.
First thing that is incredibly important is API First. What that means is that rather than writing a platform and then creating a third-party API or an API out of that, instead you write the API from the ground up first to support the functionality of your platform. That means you can then export that. It can be consumed by anybody. It’s not an afterthought, it was the way it was written from the ground up.
China Focused. Obvious, really. Where we’re going with the re-platforming and the API First methodology is we’re looking at Chinese functionality as the initial cut of this.
Cloud-Based. Again, obvious. It’s developed, deployed, and tested in the cloud.
CMS-Integrated. Content management system, a default content management system with a reference UI, which means not only are we consuming our API ourselves to prove that it works, we’re also giving you a default integration that a CMS out of the box.
Rapid Development. That is just really about leveraging the power of some of these frameworks. You have automated co-generation. You have the ability to export IO files. You get out of the box with some of this stuff, just what we’ve seen is about a 50% increase in productivity and the is using these tools as opposed to the tools that we developed the initial platform in.
Native React, same thing. Facebook framework but running on tablets. Then, Web Framework means anything. Just about anything that wants to consume our stuff. Important thing about this diagram. API Gateway. The first thing that anybody’s gonna hit an an API gateway. That allows us to manage who gets to see what, what their level of consumption is. It allows us to do throttling. It basically allows us to put our APIs out in the marketplace. One you’ve hit the API gateway, it goes into our new Spring Framework.
Spring Framework is based on a controller service model, which is- The reason that cache is there is a big red box is just to tell you that moving away from having huge sessions in web containers and everything else, it’s a big in memory front-end cache for scalability and for speed The controller find a service that will service the API call, which then calls our backend ex-distributor, which then goes all the way back.
Very, very quick overview of how it works. Reason I’m showing it to you is just to say the API gateway, the modern frameworks, the front end cache is really what it’s there for. The next thing I wanna talk to you about is the UI in the CMS, two really important words. React and reduct.
Again, Facebook. Frameworks trained by Facebook. This is based on the idea that a view is just basically what you see on the screen and you see on your phone. An event happens. Somebody pushes a button, somebody submits a form. There are a set of actions associated with that event. One particular action will be chosen. This is when we get into our store. The cause to open your API is that last slide that I showed you. That little yellow box there that is that whole slide. Calls to the CMS. What that is, it’s gone off. Let’s say that this is a flight search request.
It’s gone off to our backend, got the flight search results back, it’s got the templates for the CMS. We have all the data that we need and we also have how we’re gonna display it. That goes into something called a reducer. I didn’t make these names up. Somebody else did. The idea of the reducer is basically to take all of that data, change your stake, and then go all the way back around again to the view to display it. It doesn’t matter. Some of this diagram doesn’t matter at all, but the most important thing is the fact that it’s just a circle going around like this.
That’s all it is. The data only travels in one direction and the data can only be changed by one block, the reducer, which means it’s very quick to develop in, it’s very easy to maintain, and it’s very, very easy to debug. This is pretty much now the state of the art for UI development. t-Retail is great, but it just got better because we’re just not saying it’s powerful. It already was. Look at that.
We’re now saying it’s intuitive. There’s a reduced learning curve. There is a default content management system integration. It’s now easier to build, debug, and maintain. It’s flexible. You’re only gonna write once and it’s gonna work on every device. It’s a fully RESTful API, designed from the ground up to be that, to be a fully RESTful API. Various tools which allows to actually generate code. It underlies all of these things, powerful, flexible, and intuitive.
All of these things are built on these frameworks. Gives you the power to increase productivity, to minimize your ongoing cost, and to reduce the time it takes to get these things to market. There you go, more magic. Let’s do something magical. I’ve gone through this as far as what it means for the API, what it means to be cloud-based, what’s CMS inspiration, but I’ve only really touched on roughly what China Focused means.
Let’s take a deeper look at what China Focused, that actually does mean. To do that, I shall introduce my good friend, Liang Zhao, the vice president of operations in China. Thank you.