Improve your designs with ITERATION

Improve your designs with ITERATION

September 12, 2019 78 By Bernardo Ryan


– Fact. Your first idea is not always your best. Sometimes it can be, on a rare occasion, but I would argue that the
majority of the time, it isn’t. In this video, I want to
talk to you about iteration and why it’s so important
in the design process. I’m gonna demonstrate
it through an example of a terrible first idea of my own. ♪ What I do ♪ ♪ Is adore you all of the time ♪ – A while ago, I made a video
about designing a landing page in Sketch, and in that video, I was just walking through one page, basically showing the
tools that I was using and kind of my workflow for
laying out a page in Sketch. But I got so many questions on that video from people asking me why
I bothered to design it and why I didn’t just go
straight into coding it. And the answer to that is iteration. In my experience, the first
draft I do of a landing page is never the best version. There was always ways
that I can improve it and to better solve the problem
and get the message across. Understandably, I didn’t
show that in this video. It was just showing me
laying out one page, so it’s fair enough that people asked, but I wanted to make
this video and show you an iteration process that
I went through recently in designing a graphic to
advertise some Evergreen webinars that we’re producing at ConvertKit. Are you ready for it? All right. This was my first idea. It’s not bad. The background is the same that we have in our presentation template, so it’s something that will
then be familiar to them in the webinar, this red with
the pattern in the corner. But overall, all of these pieces just don’t feel like they’re unified. It all feels a little bit bitsy. There’s not enough
negative space or contrast. And so with my next idea, I thought I’d try a light background because that would allow
me to play with color a little bit more where
the red was a bit limiting. I tried it all centered, so
it is looking more unified, but also there was just too much stuff and the logo we had to go left-aligned, which is kind of weird. For the next run, I tried
it without the Register Now, which looked a lot cleaner,
but that’s the call to action and it was kind of important,
so I needed to include it. So going back to the one that
had all the pieces in it, I realized that my main
problem with this was that everything was kind of too
even weight in hierarchy. I needed to create some
more contrast somehow. So I decided to do this
by making a feature out of this lovely photo of
Isa, my wonderful workmate, who is our webinar producer and she hosts these Evergreen webinars. I chose to make her photo the main image rather than the illustration
or something more graphical because I know from past research that people connect really
well with other people. It just puts a more personal touch to it. So this is getting better, but it still feels a bit disjointed, having the HOSTED BY Isa
Adney on the side there away from everything else. So next I tried bringing that in and using this little
hand-drawn arrow element to link to it, which I
thought was pretty cool. Then I tried it with a
logo on top of the photo just to free up some
space there by the text. I didn’t like that, so I tried it back on the right-hand side, but a lot smaller. This was getting close but something was still feeling off to me and I wanted to really push this graphic a little bit further, and I realized it was this
straight edge on the photo that was bothering me. In the right-hand corner,
we’ve got this beautiful, like swoopy illustration. The hard edges of the photo weren’t really fitting in well with that. So the next thing I tried was marking it with a nice swoopy line to
make those fit together better. I tried out a different
illustration at the side, but things were just
feeling too busy with this. I needed to try and
simplify the graphic a bit. I took away the illustration
and put the logo there instead. Didn’t like that. Thought I’d have a long
logo underneath instead, and that was better, but the
thing wrong with this graphic was the center point, the
point where you eye goes. It felt a little bit off
having the photo at the side and then also the text
kind of at the side. Like almost, if the graphic had weight, then it would be doing this. So I needed to make some more balance and move the photo over
to the right-hand side and that meant that the text could align with the left-hand side of the graphic. A much more balanced feeling. This Hosted by was
feeling a bit odd though. The arrangement here was just a bit weird. So I felt that for the sake of balance I should drop the arrow
and put the Hosted by in line with the title. Then the last change I made
was to revisit the shapes that I had around Isa’s photo. I tried some of those colors back when I had the
illustration at the side. So now we were kind of
missing our main brand color from this piece. Like there wasn’t the main
color that was standing out. So I swapped around the colors a bit. And this is the final graphic. So we went from this to
this, all through iteration. Now like I said, that first
graphic was not terrible. I don’t think it was great but
it would have done the job. But going through this
process of iteration, critiquing my own work, trying things out, I reached this point
where we’ve got a graphic that I feel is much more beautiful, much more pleasing to the eye, and also much easier for someone to read. So I really want to encourage
you to push yourself and move past your first idea. I hope this video showed you
why iteration was so important and gave you some insights
into the little things that I look out for and how
I decide to iterate my work. If you enjoyed this video,
if you found it useful, then what I’d like you to do, instead of giving it a thumbs-up, although you can do that as well, but what I would really like is for you to share it with a friend. Share it with someone who
you think would benefit from watching this. I would love to hear in the comments if your design process is
something similar to this. Do you end up duplicating a
lot of art-boards like I do? Let me know down below in the comments. If you’re new to my channel,
then please hit the Subscribe. I make new videos about
design every single week and I’d love to have you
back here for the next one. All right. I hope you have a good day. Go do good work, and
I’ll see you next time. (funky music) ♪ I like this ♪