 Hi there guys, I was here in fact a year before talking about how we started Mozilla Open Design, some of you might have been here But I don't suspect that that every one of you have been here last year So I'm going to give a quick overview again of what we have been doing at Mozilla at open design at Mozilla Why we are not calling it open source design at Mozilla is because it's too long. So we just did it Mozilla Open Design So we're going to have a look back at 2016 what we have been doing what we have been up to and you might have noticed if you have come by passed by the Mozilla booth we have a new logo and I'm sorry that I'm after Bellum now and Bellum talked about user interaction and I'm talking about visual design now So I hope you can you can bear with me now So quick words about me. I'm a deal. I'm a Mozilla tech speaker. I go to conferences I talk about random stuff that I like like now I'm also Hacker space board member overlaps, which is a one of the Olders well, we only have two hacker spaces in Albania. So it's one of them and also a community manager for site point I'm also founder of already design, which is a company. I started like two years ago to improve design visual design and well user interaction in general with open source software and help Projects have better design in general So this helped me quite a lot Frame a bit of empathy with open source, which is something I think that a lot of designers who are not working in open source Or contributing in open source lack. So this is a very important aspect. I want to emphasize in this talk So Luckily here we understand this is not the case But in a lot of other different fields and environments a lot of people think open source is code So hey, I have this code like throw it out there and it's open source bomb. So that's it it's not that easy and There's also many other aspects to open source which I apply also to design and me as a not a developer I've always had a hard time figuring out how I can help open source projects So when I started off, I thought hey, I like design. Hey, I like open source But I don't want to be a jack of old rates doing all these things together So I try to figure out a way how I can combine both of these things now believe it's very important to Figure out a way how to offer non-technical contributors contributing open source And I think design is one of the most important aspects to that so one important aspect like which is the equivalent of open source or free software licenses like the GPL in design is creative commons It's something which really puts a match into all designs we create. So For example, the equivalent of GPL in design is well, we can debate about that But I believe it's we have commons share like attribution attribution share like so this ensures that design is always shared and licensed under a free Well open source creative commons license So I believe when designers know how to license their work and how to put it out in the open They can be better contributors to open source So having this in mind we created a GitHub repo on Mozilla Mozilla open design Because there were so many people were asking me personally. Hey, can we help you with that? Can you create a badge can you create a sticker from me? I was like Feeling appreciated, but after quite some time I felt like hey, this is not a community It's just people asking any or doing things This is not the spirit of the community So we tried to create a GitHub repo on Mozilla Where all designers even staff and volunteers would create would collaborate together and people Mozzurians from the community would ask and request design and we would help collaborate together this was very helpful actually because Every design could be tracked across the board We would know where the source files are it would not be a JPEG image, which would be the output Everything would be licensed under creative commons attribution share like license. So it was very neatly organized in one place So just going a quick overview of how this worked out This is Sorry, I'm not pronouncing his name there And so this is a guy from India who is create doing a Indian meetup for the Mozilla community and he needed a sticker basically so he's basically giving a brief of what he needs And what he wants it to look like and it was for the meetup in 2016 in Pune So obviously the sticker would have something related with Pune And he got a good deadline was 18 August. It was July. So we had quite some time to create it. So that was this guy creating this illustration of a of her structure in Pune, which was one of the symbols of the city and We ping-pong feedback we talked about how it might be looking better in the Mozilla style and how this would obey the guidelines obey in yeah, whatever and We came out with this result after a lot of ping-ponging feedback. So this was one of the Easier tasks, but this was the way how we would work things out after this was put out We will put all the source files in the GitHub repo and people could reuse it even people from outside What's a lot because it was under creative commons license Earlier one year ago. In fact after fast them 2016 Mozilla came up with the idea that guys we need a new brand because There was something lacking with Mozilla back then we only had the word mark it wasn't a proprietary phone by the way if you if you don't know and It was quite weak if you look at the other brands For example, this would be Pepsi Facebook or Google if it would be in a style Mozilla hat like the gray word mark and We also lacked a proper Proper icon we had the M, but we didn't have really a color or original style to it which People make which makes people scream I you that's Mozilla So we had some discussions and we asked people. Hey, how do you recognize Mozilla? Is it something? Is it a fighter is it? the gutsy one is it some someone who fights for the good and we'd ask people How they how they see Mozilla? So Also as bad and said before we didn't just go with a visual design But we asked people how how they percept the whole experience of Mozilla how they think Mozilla should be and what role Mozilla should have in the world and According to that perception of all the people we started creating the brand identity and Having an idea of where we should start So this was the first phase This was done by an agency who was taking the feedback from the community and implementing it in several different ways and Community the community could give feedback on what they don't like about each direction and What they don't actually So I'm not going into details here It was you can check out the block to see all the designs which were happening. It was really messy and Depends on how you look at it. It was also fun because it wasn't supposed to be clean It was supposed to like give to show some different directions to the community So this was the first phase A lot of people commented on a lot of controversial things. Of course, it's always happens and This was the second phase then so we had two directions with the protocol direction which Basically takes inspiration from the HTTP protocol And this is all for the final result we went with the protocol direction and As you can see the new logo will always be highlighted The same as you would do an old on old computers So the Mazzua Woodmark cannot stand on its own without the black box And it also takes inspiration from the protocol as you can see Some people see the meh face in it like maybe too much Facebook. I don't know But yeah, this would be the icon as well. It's It does a bit on more personality what we have used to have We also have now different color palettes. So we are going with black and white With the idea that we have a lot of contracts. We're gutsy. We have a lot of courage for that And but we also have colors. So this will be our new color pad and this offers a lot of people to play around with different elements for their own communities and The nice thing about this is that we created a new work new font if you might have known about our vision open source font But it's very It lacks a lot of characters. So we took our role And we are implemented. We are changing it quite a lot to our needs and we are creating Zilla Zilla is like the ever derivative font of Arvo Which we're going to put out under an open font license in the end of February. So this is not out yet and like everyone can use Arvo and The font has such an implementation that if you write Mazzua, it gets translated automatically to a mouse protocol Yeah this is very interesting and The fun thing about the imagery is is that this will be very messy. There will be no guidelines like hey, please Please obey the guidelines stuff like that. So the Mazzua workbook will always be on a black box But everything about that can be messy as much as people want So the idea we had about communities would be for example if we would have Mazzua Belgium We would have an archive of gifts and imagery Which would be put on on the other side of the logo and this would be a dynamic experience and Just like it would be messy. It would not be aesthetically pleasing Maybe but this is just the way the web works. So we want to implement the chaos And the messiness of the web also in the brand identity. We didn't want to To be the classic designers which want to make things look good We want to translate the idea of the web into the brand identity. So these are also some Some examples of how that would look like So it's really really random if you've been a bit of if you have a bit of experience with Berlin art style So it's like graffiti random messy It's it's very nice and it's not really Convertible looking at it. I don't know. I don't have a better word for it But it's it's just like what do I is in some kind of way we are not a corporation in the classic sense We are Someone who is like an advocate for the web and we wanted also to the better identity to look like that So this is also something Else like we can play on with a new brand identity. So I'm going to show you quickly Video of how that would look like in animations Sorry, there's no sound, but it's just random music. Oh, okay. I think I have enough battery So this would be some examples of the community logos Come on. So, yeah, that's logo in real time and If you want to get involved into creating designs or asking even for designs Please feel free to get involved in our github repo and you can also check out all this stuff I just showed here and the design language stop. What's about the talk and Yeah, for anything else, I'd be happy to answer any questions and yeah, please reach out to me. Thank you