 O nosso prosporador, então, está vendo que a aldeja é bom preso, agora eu vou poder só falar em inglês. Tendo como base o propósito de ter um admin todo mais simples do intuitivo e vai falar na... Às vezes tem uma vai falar sobre um ano durante o termo, às vezes a gente vai gostar, estar com um mês e tudo isso, para ser uma tratação com quem gostar. Então, o nosso próximo caso é de poder falar sobre um ano durante o intuitivo e um ano no UI. Eu pensei que o problema com o UI foi que o usuário já era um amigo, mas o problema é que o branding não é. E, claro, se o seu background é em branding e marketing, se você concorda com o Alexander, eu não acho que eu tenho que pronunciar o nosso nome. Fiquei com certeza. Então, o Alexander... Muito obrigado, Alexander, por falarmos sobre isso. Muito obrigado. Ok, bom dia, todo mundo. Espero que você faça o primeiro talk. E eu vou falar sobre as interfaces e usar o WordPress como o CML, o Framework Management. Isso significa que nós não falamos sobre os blogs. É mais sobre o B2B ou as websites de empresas. E é por isso que eu estou falando sobre a approach e os moves, como criar, digamos, a interface para o final user, que não é você como desenvolver, que é a sua prova mais firme. Então, é isso mesmo? Agência-oners ou Business-oners? Ok, bom. E é isso mesmo? Algumas maneiras de conteúdo que estão fazendo com as instalações de WordPress? E você gosta de todas as instalações de WordPress? Ou você preferir algum? Ok. Então, precisamos definir o que é o uso de interface e o que faz isso? E há uma definição sobre o interface que permite o usuário fazer as coisas both efficiently and effectively, you know the difference, by the way, everyone knows. It's not so obvious and without distraction. And there are three golden rules of the good interface, they all defined pretty well on many talks and a bit changed the words of them and adopted for the modern world. And the first one is to reduce cognitive wall. That means you probably know the definition don't make people think, which comes from the Steve Krupp book, don't make me think. And that basically means that if you do something that cause people to struggle, they will most likely believe, hate or whatever, they will not be satisfied. And if there is no cognitive tension, if there is no way to struggle with your interface, people will be more satisfied. And there is a good example, not from the digital interfaces, imagine your interaction with the band, what is the good interaction with the band? It's something that doesn't cause you any errors, struggles, and you don't get the holidays with the pocket part because of the band. So that's a good user experience and it's a good communication interface, whatever you call it. And the second rule is make everything, in this case interface, consistent. That means everything stays in the same place all the time and also it is obvious where we can find things. And in terms of the business websites interfaces, that means that your content manager on our website is able to find anything in the admin area easily. So like, we have a blog news team contacts on the front end and basically the ETL situation will be to create the same structure on the backend or to use front-end editor, which is doubtful thing sometimes. And the third thing is keys. No one knows what is keys. Keep it simple, stupid. No, it's not virginish. Ok. And, very important thing, keep it simple and stupid, not only applies to your user and also applies to you as a developer. Do not over exaggerate things where it's not necessary. Keep it simple, keep it useful, make it real. Straight forward, big keys, not hard one. I will show you some examples, that's basically it. I, as a developer, got into WordPress like 7 or 6 years ago. Before that I was working with you guys design content development and so on. Ben, I discovered WordPress. At that time there were no page builders, they were just emerging. There were no really easy to use custom meta fields plugins. So that is a bit down example, I would say, for nowadays. I remember it's quite like 6 years old. It's a single page website. So basically what do you think you would do to make that thing, in terms of the interface. And there are principles that I mentioned, that I have applied here. First of all, all the sections are in the custom post type. And we can rearrange them, for example, and it will change there, of course. And that's what the part of keeping it simple, right? And also, for example, the services are just having, remember that's like the real old thing, don't think that that is great, because there's just a first implication of the principles. But, for example, here are the products that we see here. And each product has custom meta boxes, which are made basically in the functions. And that's the thing which I consider more useful. Because we have the atomic information that is displayed on the front end, and it is more or less consistent here. And it's the same consistent and atomic in the admin area. So you don't have a block which will break the things out. And you don't have base builders, which generating basically a lot of unnecessary code in the most cases. So that's the first example, remember. Now I should apologize, because the rest of examples will be in advance, will be in Russian. But you don't need to read the text, you just need to see the image and to see the stuff on the front end, in that case. There was an MVP startup for the aggregator of hotels in different places. And at that point, it's very important what was referred about the custom pages, taxonomies and so on. When we start to think about such type of website in terms of informational architecture, we need to define which things will be our custom posts. Like, in that case, there are articles, there are, they call it cards, which basically means the hotel card, and there are custom landings for the, let's say, special projects. And I will show you an example of the article. That's the article page, it's Google translated, so don't be scared. And it's pretty huge, and I want you to think about how you would make a thing like that four years ago. It basically looks like, more or less, just plain content area, right? But having noted one thing, having noted one thing that's here, are the sections which are the definition of those sections. And basically, when you click on them, it's like a modern media approach, when you click on them, you get straight to the point. And those things are also highlighted on the front end. So you basically cannot grab them from the content. You should define them as atomic pieces. And when it comes to the back end part, it has the same structure with atomic pieces. We only have a definition here like the excerpt. Then we have, show it on the main page, the icon here, you might see it on the front end. And then, a lot of things which define the article. And, like that. Here, that is made with the flexible and repeated fields. That means that you can, at any time, edit any type of the content in any place, rearrange them, switch them, and basically change the style. So I'll show you. Ok, yeah. So here, those things, those titles, are going from here. And here is the content line. Here is the excerpt that we have seen on top. Here is that content. Here is the gallery. And each gallery piece has a description. And that implies the total custom front end team, of course. And the custom flexible admin area. And here it's important to understand that this will be supported by real people and it might seem a bit too complicated. But the thing is, the atomic pieces of the information that we are able to rearrange and people are able to maintain them easily and consistently are in fact saving time for the businesses because if the interface is badly made then on each edit, on each new article edition people will spend like 5, 10, 15 years extra and that will cost your money or time or whatever. For example, this place, the other approach, here is the vetting website. And the thing is, here, the content is also pretty like a magazine, in a magazine style with a lot of graphics and with some custom things and as you see, the image is also customly masked. And here is the demonstration of the other thing. Don't make a cognitive flaw for a user because in that case, the person that contains that website is absolutely like no tech in any way and that's why. This interface uses a lot of the WordPress core functionality. Like everything that you have seen there with complex galleries on the full screen are using basically the default WordPress gallery shot code and the images are automatically cropped, automatically placed into the place and so on. And the most beautiful thing here is the code that you make to make a front-end part. Imagine, that is the archive of all WordPress, all projects. You see like 20, 30 lines of code and it is the code of the single page that you have seen with all those, I will show it in more details. Here we have like all those things, all those atomic pieces, I go basically to the galleries, something like that. And here is the editor. This is all atomized and it contains to be as simple as possible for the final user, which is not expert at all and which have a bit of experience with the default WordPress functionality with the blog posts and that's why it is maintained to represent his experience, he is his life and here is what we see which is totally custom on the front-end part. Ok, so one more example, I still wait. Is it interesting at all? Ok, that last example is the most complex by now I think and it represents the landing page for the particular single event of the cultural and artistic venue in the center of Moscow and that requires not scrolling in the presentation but showing you on the light. Here is the theme, how it looks like on the web and it is Google translated for convenience you can see the things and here you see a lot of custom stuff like it's like a magazine, a ready mag, layouts and whatever, right? And how do we deal with that and also there are related items from the customer store. How do we deal with that basically, right? And also it implies the custom fields custom posts with custom subsonomies here we have a taxonomy defined in the type of event which will be displayed of course on the front-end and which will be used for the filtering on top of the things if here we go there is a filters for all type of events and you just choose it here or help in the theme and you define that person could select only one thing because you cannot have the single event which will be at the constant lecture at the same time and with any custom taxonomy you will be able to select several values for the taxonomy e there is also a great and very useful mouse lingual theme I will touch it in details by now because it's important to know how to make easy to use mouse lingual website just a button which switches basically all the content which does require translation but it does not switch the things that does not require translation here is the days, the definition here are several days and the type of the event they are not switched the images are not switched they are maintained and here here is an example we can change what you have seen there the backgrounds we can change if we should if it is the event with the proper lens in the page or not and all the things that we have seen there of the magazine and readymade type of layout you can see it here you can basically edit anything there are pretty fine pieces you can make wherever you want how many you want from them like that depends on the design more than from the admin interface and here also we were trying to adopt how it was represented on the front end like if we have an image on the right title on top and description of the image and that layout on the front then we will represent the same thing on the back end and there is another type and the image on the left then we switch it it's basically like the rules what I have been saying about the consistency if people choose in the left it will appear with the image on the left it's so obvious thing but it's important to not forget about that and to consider that all and of course most important thing that I wanted to tell about those things in this approach you can make it all that's the greatest thing you can make it all using only work press or functionality you will struggle a bit with the custom fields I mean its status work you basically will struggle one time making and understanding custom post types custom taxonomies but at the end the reward is like great because you can make any kind of things and then you can apply whatever you want with the custom taxonomies like you can create versatile events calendars you can create for example there was an example creating the event booking calendar with booking form with several dates several time slots all made on the work press with the rest API and represented with the custom post with custom taxonomies so which basically ease your life drastically it allows you to create those repeater fields and that's called flexible fields means that you make as many blocks as you want and choose the layout type what I've been showing you the type of those layouts they are called flexible fields so that's basically about this approach I was trying to get into 20 minutes so I didn't get into much details so if you have more questions about the approach about how to make those things easy to ease your life to ease your customers life and sound please feel free to contact me and don't forget that if you make the interface which is useful and easy to use you won't be contacted in 3 years like you made a website can you change those things for me I don't understand a thing here so that's very good thing I believe right? if there are any questions we have time for a good question ok ok do you em all the projects do you take in account what the level of your clients the level of knowledge your client has so you can accommodate your interface to the client do you just go as simple as possible that's like both things because it's a great question I was referring that there was a project where we should write a lot a lot more to alter the default or pressionality like the short course of those things which could be made easier with the atomic approach but it was made that way with the focus on the client on the end user and that was it no very beginning focus on the end user because you basically would not want to get back to old code in like 5 years and those websites are working for this time and let's get back just for a little bit for this client I think maybe maybe someone want to to recall it and take notes so consistency means the overall information structure and the approach that you take mines the structure of the interface information this cognitive law means that you are thinking about your user if you will maintain your own law you can do whatever you want if you are focusing on the expert content manager you can do the best things and agree with them but that might be fault to all because if you give a lot of complexity to the interface at some point it will break always because people are breaking things and I keep a simple answer that applies for you as well I mean don't over complicate that's it like if things could be made a simple way that wouldn't interfere wouldn't break that's it ok, thank you