What's up guys in today's design view we're going to take a look at the UX Design Inspiration website Awards com See what the size of the month is, which is canals. We're going to jump straight in. I haven't seen it So we're going to launch it and see what we think from a UX UI point of view
So this website it's all about Amsterdam. So I think just Sweden quickly at the websites It was kind of like a history of the canals. I was in Amsterdam and It must be a great website to be cited a month and as you can see, so starting off It's got like a lot of intros to the site So if you want to check it out,
 |
| https://canals-amsterdam.nl/ |
it's https://canals-amsterdam.nl/ NL I'll leave the link in the description So yeah, there's a lot to talk about already straight away. So Fast so good time We don't have anything a lot of these websites have this hover thing when I want to move my mouse at the moment Which I'm not a fan of for this website seems to be clean.
So Let's talk about this font. First of all is a selectable font No, so it looks like that's part of the background, but it's very nice font See the way the lines very thin too kind of got that Art Deco style, which is very nice and it's very curvy I'd like to know what edge but there's no way I can find out by selecting it.
Normally if I want to find out what a font is I normally right click and then inspect the element and then go in and I've lock in the code I'm a big fan of this this red color and see the way if I hover over the The arrow then changes.
That's quite nice. I like big chunky buttons. I don't mind the huge You know that buttons like 300 pixels tall by 300 pixels, but I don't mind it. It tells me what to do. So So it's a horizontal scrolling website I'm not a huge fan of horizontal scrolling websites.
I think people get lost in them Especially when there's a site there's a bar on the side sometimes cause the opposite way I haven't got that on there Let's just take a look quickly what the menu looks like.
So in the top left hand corner, this should be a menu Yep zooms across a full screen menu. I'm a huge fan of full screen menus. I think they take the users I take take all the stuff out the background and just allowed the user to concentrate on what is actually going on here So you can see this, you know, it's not meant to be a functional pure website what it is It's an art piece .
that would go in a museum or would go towards It's a piece of pure graphic design, which I think is actually doing a really nice job on it so far So I like these huge buttons. There's no hover State on it. I'd quite like that button. So maybe go black and then Do the opposite just so I knew I was hovering over something.
Otherwise, I just have C radius as a hover State I'd like the button to maybe have one. So then we've got overview reclaimed expansion timeline.
Yes, he did Look at the number zero on the left hand side That's quite nice. So Let's close out of it so far so that free Lang goes to a one when you close it So let's just click on this arrow.
See what happens so we pan across a Huge one - this is the overview so it talks about All of our amps and I'm I'm establish canals so so scroll or drug so I scroll Yeah, I go to the right And I can also drug so it's got a parallax effect as well See the way this left hand fingers actually paddle across the image and so you can see the other car that's been revealed That's a parallax effect.
That's something that's quite easy to achieve on our website and it kind of gives it a little bit of depth It's kind of how we see things in real life like near objects move favor objects.
Stay away That's something that's on a lot of websites It's quite a table I think the reason this websites so powerful so far is because it's using a Geo term theme or even Monochrome so we spoke about design trends in a previous episode and we're talking about like one or two colors on websites nowadays
So this has got red black and white so there's three colors but two of them I like your primary colors on a website But I think it just it just that one solo color gives it a strong visual identity.
It's it's a beautiful color it's like an orangey red and it makes You know It just makes it pop every time you see it look kind of like it's kind of like me in the magazine the way they've got they've got the the Fonts in them So it's all unselect able.
So it's I don't know how they've been impacted here So then we've got captions here, which is very similar to a magazine So it's kind of based this could easily be printed off. So we've got single columns So if I was doing this, I wouldn't I don't think the text is selectable Yeah, so if I was doing this I wouldn't go for the horizontal scrolling. I see what if done it.
They've kind of It's a style they've chose to have on the website. Well, I think you can quite easily get lost here So then we've got images crawl across Yeah, so there's not there's not much interaction going on it's more like I'm literally flipping through pages of a book I guess that's how it's meant to be designed but It's not the easiest to read I like to read the i3 the text comes in But yeah.
after a while it gets a little bit boring fun on the cross But again, come on to these these colors stand up and I think the whole website actually cedar says it's going to reclaim now so I go back to menu and then it's actually planned me into another section just by going across so I guess if I click expansion it's gonna have me automatically across and I can want to go back here Yeah,
so this whole website is just one giant scroll Let me know in the comments what you think about that I think If this was a functional website like an e-commerce site or something then you'd be like Oh obviously don't don't do something that but because this is This is an art piece,
this is a very graphic design website It's It's not the easiest to read there's not many videos in this I think it would have been nice to have it been my interaction So I went like so you want to hover over this one two? And three there like look like buttons the price there's it's all very flat and it's kind of like literary sources lay the magazine Horizontally in front of me I think There's an a beautiful job of actually designing the website in the fonts.
They've chosen ice the colors nice every graphic design piece They've put in is nice, but there's no this see this is good to see the circle moving around there Just a little bit more of the fair dimension would have been would have been a bit Whatever appreciated to have I like the way the menu change color there So I've seen on some websites when you change section the menu changes color That's quite a nice.
Remember Google dinner a couple of years ago. They have at the end of the year They have a a year in trends Year in search website and back in 2015-2016 they did one where each section at different corner and the menu changed and I'm digging that I see this site only got one color.
So that's why it hasn't changed to any of us, but there we go That's what I'm talking about a little bit of animation over the top so they do have it It's just it it's just in little bits Text coming in I Think so let's have a look.
So this is all clickable Yeah, so just stuff like this. I think the probably could be could be more of it actually It's all clicking on them.
It's normally actual interaction things on a website Think of nothing I've crushed a website I'm just gonna I was gonna reload this huh, so I interrupt a bit. It must be a huge website I Mean you can see by demand of actual visual stuff in there. Let's let's head back there anything else I can do. So let's One of these X's at the bottom.
I don't know what I don't know what they are. I Definitely need them. I don't they look like to someone I can click or someone's missing Maybe this is like a style that they've gone for like this kind of looks like you know You see a book and you see the ridge of the book when it's pointed in they've they've clearly based it off desks I remember their magazines we used to put like like London or New York there and then this would probably be the issue number So,
I guess maybe maybe that's what we're going for I don't know But then we get back to the timeline again, let's see if it doesn't crush this time Yeah, it just pans across So let's just check out about and see what the about page is like So content design So it's natural it's a pet.
It's a personal project it looks by Markus Brom I think For a personal project. This is a fantastic website and I can see why it's been nominated for four websites of the month just everything from the way The ideas in the website the fonts that they've chosen.
The feem of the website is really good to have a strong theme All the website is trying to get or trying to get me as he users to do is understand the History of the Amsterdam canals there's no there's nothing that's trying to it's not trying to take my email address It's not trying to do do anything tomato's trying to teach me and I think the amount of effort at the pointers website is great I think it's going to stay for a long time.
It's kind of like a timeless piece Are so it's an infinite scroll so you can actually go back to The thing the things I think could be improved. I'm not a fan of the infinite scroll I'm but again, I guess it's kind of go for like that coffee table.
Look I like the colors I think it could have more interaction I think it could have a lot more videos, you know, so You know a lot more gifts to the canals videos of the canals, maybe some behind this like I think Something like 60% to the Internet is video now and that's the way people are going. Whereas.
This is very much a book that's been Made into a website rather than a pure Digital product because you know, I'd quite like to click this and look at a time lapse to the canal and Get a little bit more in I think this stuff that you can add to make this better But I think what they've done is a great job and it's a beautiful website So check it out the canals - I'm slammed NL until next time.
Oh one last thing if you guys haven't already check on school that Anthony convoy comm if you want to learn the basics of UX and UI I've got a whole course on there the loads more videos like this reviewing websites I teach you loads of tutorials and other Bechste in figma how to use It's all free. importantly to learn along the way so move all that out the way until next time keep designing
0 Comments