5 Ways to Pretend You’re a Designer
A beginner’s exploration of current trends
I’ve never thought of myself as being creative. No one in my family can draw, paint, or play an instrument — the stereotypical lack of creativity. My brother is easily the best artist in the house, and he turned 5 last month. We are all “left-brained” people, supposedly good at numbers, logic and reasoning. I’m a Computer Science major, interested in front-end development. I enjoy what I do, as I get to see an idea come to life on a screen using keystrokes.
During my internship at the digital/creative agency Critical Mass last summer, I was amazed at the quality of work the design team consistently put out. I was in a developer role like my friend, and we frequently agreed we were less talented than the design interns. With that, I decided to leave all future web & UI design to the much more capable people. I strongly believed they knew the ins and outs about colour theory and typography since birth.
This was my mindset – until I downloaded the Sketch trial.
The program’s interface was so simple and intuitive, contrasting the intimidating Adobe editors with their million of options in the toolbars. Have you met anyone that opened Photoshop for the first time and confidently said: “Yes, I know exactly what to do here.”? So I clicked on Sketch’s Web Design Template, and started throwing shapes onto the screen. It was far from pretty, but relatively quickly I had a decent understanding of how to use the program.
I now had the power (lightly speaking) to design a idea before actually developing it. Instead of changing CSS styles, I just dragged a rectangle to where I wanted it. Design was now fun.
Looking for inspiration to flex my Sketch false confidence on, I discovered Behance and Dribbble. The latter appealed to me more, as in my opinion, it had better web and mobile UI designs. I began to browse the site daily, and noticed a few patterns. Left-brained, remember?
Here is what I picked up, and started to use in my design exploration. A word of caution, I am in no position to tell anyone how to design, these are just my findings of current trends – and how you can use them to trick people into believing you are designer.
1. Overuse high quality stock photography
A large part of the reason why web designs appear so well made and clean is due to the fact they use great assets. If you step back, and imagine the design without them, there is not much to it that’s left. Of course, being able to pick those assets and work your ideas around them is a not an easy task, but with the ability to capture great photos — some phones shoot 4k — , designs rely heavily on great photography. Sites like Unsplash make it easy for anyone to use high quality images in design prototyping.
As an example, I’ll make a landing page using one of the first ten Unsplash photos.
There. Now let’s add a trendy caption in a sans serif font.
Also, let’s add some navigation links and a dummy logo.
Done. There’s your landing page. It’s not amazing, but it’s relatively clean given it was made in about 42 seconds. Because of high quality assets, the rest of the design can be pretty much slapped on impulsively. Overusing Unsplash is the first step of pretending to be a designer.
Here are a couple of Dribbble shots demonstrating the use of great photography in combination with simple design.
Have you ever visited Slovenia? If not, make sure you will give a try soon! I've spent few weeks in there and I fell in…dribbble.com
Hey Dribbblers! I'm trying out some type variations for a personal project. I like how versatile Circular is. It can be…dribbble.com
2. Stretch your assets corner to corner
Make images and videos cover a whole section of a screen, or in other words, create a bezel/border-less feel. This also applies to design structure in general, as squares are the easiest to deal with regard to responsiveness. Stretching assets maximizes screen real estate, which proves most important in mobile experiences.
Suppose we are designing a blog style webpage. A common theme would be something like this:
It’s a solid, functional design. But clearly not fashionable enough.
A vertical split of a page is something I’ve seen quite frequently. This allows for placing an image to take up half the page, corner-to-corner. It could look something like this:
And the mobile version:
If you are reading this post on Medium’s app, you will notice how the images fill the whole width of the screen. This gives it a flat, clean feel. This common mobile layout is also demonstrated on Instagram’s photo feed. Just as you are pretending to be a designer, pretend images don’t like borders.
Here's a little project I just recently started working on with my front end bro @Riccardo Zanutta. More screens and…dribbble.com
3. Use shadows whenever you can
The goal of Google’s Material design, and flat design in general, is to give users a clean and minimalist feel while using shadows to generate an impression of depth and perspective.
Feel like your design is too simple it’s boring? As with stock photography, feel free to overuse shadows.
Here’s an example.
Too plain? Don’t worry, simply add some generous shadows!
Now we’re talking. Look at that depth.
Button should looks like button. I'm not sure about it, but here is a first try, maybe too "fancy"? ___ (feel free to…dribbble.com
4. Don’t stress about type, use sans
I have learned that typography can make or break a design. Throughout my Dribbble browsing, I have learned that type is the best at setting the mood of a user interface. For example, in trying to convey a friendlier user experience, someone may use a more rounded font, like Bariol.
Going for something more classy and luxury? A serif like Baskerville is good.
However, especially for someone with no previous design experience like me, I found that playing safe with a sans font like Roboto, Muli, Open Sans, or one of my favourites, Karla (below), works well. In my opinion, it is hard to go wrong with any one of those.
At the beginning of your design exploration, don’t stress too much about type. Go on Google Fonts, filter for a sans font with several thickness options (to give you some variety), and just go with it. Also, Comic Sans is a great option if you’re going for professionalism.
Hey friends! It seems like I'm not quite done with Apercu yet. The more I use it, the more versatile it seems to me. It…dribbble.com
5. Whitespace is your best friend
Whitespace is great. It allows us to steer attention toward things we want users to see, while keeping designs clean.
Want to put in the least amount of work in, but still appear to be minimalist and trendy? Put about three rectangles on your interface, and leave the rest white. You could also make that great sans font you just picked about 100px. The design from the third point has more content than about 75% of the sites made in 2017.
Hey friends! I'm trying out a few type combinations for a project I'm working on. What do you think of Freight paired…dribbble.com
Excerpt from visual and typo explorations of an agency portfolio website.dribbble.com
Hero Banner Concepts - Creative Agency The 1st of many concept ideas I'll be producing, to up my design game, maintain…dribbble.com
All sarcasm aside, I think my findings have shown me the specific components of minimalistic, clean, and flat design. When we’re surrounded by so much digital clutter, we feel relief and comfort when we use, and look at simple, minimal interfaces. This feeling is what shapes modern design.
You are now a designer.
Thanks for reading my first post.