- Hello everyone, Charli here.
Today I'm coming to you from a hotel room in San Francisco
and I've got a bit of a different video for you.
There's another designer here on YouTube called Dann Petty,
he's been running a design challenge.
he created this fictional space travel company
and gave a brief for people to design a logo,
a homepage, and also an app.
And he's asked me to help out with critiquing
some of the homepage designers.
So today I'm looking forward to showing you
some of my favorites and critiquing them
and this should be a great video to get some inspiration
and also some learning of what to look out for
in your own designs.
One more thing before we get into it is
that Dann is also running a conference
that I'm speaking at, which I'm really excited about.
It's coming up very soon
and I think it still tickets available though
so if you want to head to WinterWorkWeek.com.
it's got all of the information of speakers, the tickets.
It's a conference that's held in Yosemite
and it's mostly workshops.
I'm hosting one about self-promotion for designers
like finding your niche, working on your portfolio
and really looking forward to it.
And there's so many great people there
like this is a conference that I would
want to go to even if I wasn't speaking at it,
if you know what I mean.
So check it out and if you feel like coming
it would be great to see you there.
Anyway for now though let's take a look
at some homepage designs that were
entered into this challenge.
(chill music)
So I noticed quite a few trends as I was
looking through the entries for this competition
and a lot of them came from what was directed in the brief
so it's good the people were listening.
Dan said that the company wanted
a black and white design with one or two accent colors.
So I think because of that,
I saw a lot of dark UIs, make sense
because space is dark.
So that's the route that most people went down.
He also made a comparison that
this space travel company is more
Virgin America than they are United,
so that gives an idea of the look and feel
that he was going for with the design.
I think because of that Virgin America
mention in there a lot of people went
with this pinky red gradient as the accent color.
That's a color that Virgin uses
and I wouldn't really recommend
if someone makes a comparison in a brief
to use the exact color of that comparison company.
But in saying that, one of my favorite designs
entered into this competition
did use that pinky red gradient
so I just wanted to mention it.
It's this one here by Simo.
It's got this lovely header.
I love this use of the spaceship window to play a video,
I just think it's a really nice UI element.
All in all, I think this page
has been really nicely designed.
Even though it's not interactive,
I can imagine how I would interact with it
and I just think that that is a sign of good UX
when you can figure out how to use it
just from looking at it.
I know flat design is really in at the moment
but I always appreciate a little bit of
texture and layering and just ways
to give web designs a bit more depth.
So I like that in this one,
we've got these lines behind the images
that yeah, puts it on another layer.
And I also really liked how in the footer,
there's this use of the photo.
So instead of just a plain dark background,
there's like a dark background of space.
Another design I really liked is this one by Ted
and this used a blue scheme.
I love this little booking UI at the top here.
I think that's great, it stands out from the page
and the main point of the web page
is to make the booking so that makes sense.
As we scroll through the page there's just a lot
of really lovely UI and design elements
and lots of information that you've considered as well,
which I felt like made it a really realistic design
because realistically there would be
a lot of information to go on a space travel booking site.
And so even though as designers we like to keep
things plain and empty, the real challenge is
displaying all of the complex information
in a way that still looks easy to read
and you know, with enough negative space,
which I think you've done well here.
Even though Dan said,
you just have to make a homepage design,
a lot of people went above and beyond
in this challenge and really expanded
on their skills and like,
you know, tried things out.
And I loved seeing that,
I especially loved seeing all of the animation
that was involved in this.
Interaction and animation is a really
important part of web design,
especially in 2018.
And so I just want to show you
some of my favorite examples of that.
There's this one here that had a beautiful way
that the planets switch and as you scroll down the site.
All of the information, you know,
it comes in together.
I love that was considered so nice one, John.
This one was absolutely beautiful the way
that it just drifted in,
it felt like space, you know.
And we've got the moving background there
as well so you could kind of imagine
yourself flying through it,
I thought that was really nice.
This one had really lovely animation
as you switched through what planet
you're gonna travel to or moon.
And then some people went even further beyond that
and actually built out their homepage design
so it wasn't just a mock-up and it was an actual,
you know, functioning design.
This first one was designed by Mike Dowsing
and then built out in Webflow by Waldo.
And I like the team work there
and also that they went to the effort to put this together
and show all the parallax animation as you scroll.
Another one of the designs that I loved the most,
also just so happened to be one that was built out in code,
it's this one here by Nathan, I think.
I thought this one had a really nice typography,
made good use of images.
One thing I will say though is that
and as you can see my computer is
having a struggle showing you this
while I'm screen recording is that,
when you put a lot of animation into websites
you've got to think about how that will
affect computers with slower processes
because not everyone is viewing a
website from like a super-fast iMac.
I want to give a special mention here to Christian,
who entered what they said is their first ever web design
and I thought that was pretty cool to
take this challenge as a chance to try something new.
There's a lot of great things
that have been considered in this design,
a lot of work that needs to be done
on refining the UI and refining your design eye
on this, Christian.
But overall this is an absolutely amazing
first attempt at web design
and I hope you keep going.
So most of the designs we've seen so far
have had a dark background, like I said,
that's what most people, the path they went down.
So that meant that when I saw a light design
that I really liked, it definitely stood out to me
because it was different from the rest.
So I want to show you a couple of my favorites there.
There's this one here which is just
a super short homepage with the booking UI
and link to have a tour across the ship.
As well as the navigation, of course.
I like this idea of a short homepage,
it's not something that I saw many people do.
Most people had a lot of information on it
but sometimes a short homepage can perform really well.
I think the booking UI is really nicely designed
and I loved the use of the moon on the light background.
This one here, by Jason,
made really nice use of imagery
and I also liked the modular design of it.
It starts off with the booking UI
and then all the other information is displayed
in a really nice way that definitely
makes me want to go on this trip.
Like, it feels luxurious but it also feels fun.
This one here was really interesting to me
because it had a lot of creative elements
that I hadn't really seen much before in web design.
I liked the drips that they used
and like, the texture of the little
crosses all over the place.
I don't think this is the best design
in terms of convincing people
to book a space travel flight like,
showing them that it's safe and that it's secure
and it's gonna go to the moon fast.
I don't think it feels serious enough for me
to trust it with like, you know,
my life essentially going to space
but I really like the graphical elements of it
and I like to encourage new creative thinking of web design.
Not everything has to be just boxes, you know,
so I wanted to mention it.
I keep mentioning the booking UI in these critiques
because that was part of the brief that
the site is for people to book travel
and to make it easy for them to book travel.
So I was always on the lookout
for nicely designed booking UI
and sites that made that the focus
rather than the beautiful imagery, which is important
but at the end of the day
people have to be able to book easily.
This one by Matt was a really nice one for that.
It made good use of both black and white backgrounds
and the booking UI stayed on top of the screen
the whole time as you scroll
but it wasn't really like in the way.
It felt like it should be there
and it made it easy to book from
wherever you are on the site
and I thought that was really nicely considered.
I want to end on a couple of those
really nice graphical considerations made
and really nice work done there.
This one, love the homepage,
think that that's a beautiful graphic to start with.
The UI of the site itself
isn't quite as strong as the graphical elements
but I think that this is a great start
and obviously Andrew, you've got a lot of talent.
This one by Kyle was absolutely beautiful as well.
I don't think it was the most functional of the designs
like you definitely have to think a little bit
about this site in order to interact with it
so the UX isn't, yeah, quite as strong
as some of the others I've shown.
But it's absolutely beautiful
and it definitely feels special,
so yeah, I wanted to show you.
So that's a look at some of the entries
in the space challenge.
I hope you got value from hearing my thoughts on them
and also some inspiration just from
seeing all those amazing designs.
If you want to see more of them,
you can find them in the space challenge hashtag
on Twitter, that I'll link below.
And I think it's next week that Dan will be
announcing the winners of the challenge
because he's giving away some
pretty amazing prizes.
So stay tuned for that.
If you're new around here,
I make videos every single week
about design and my life as a designer
at a tech company working remote.
So stick around, hit that subscribe button
and hopefully I'll see you in the next video, bye.
(chill music)