:D vs D:
So, you’ve busted your ass. Through 3 months of dev bootcamp, 4 years of a CS degree, or a life-time of crappy jobs and now you’ve arrived at the pearly gates:
You can bear your head to the sky and proclaim “I AM A JUNIOR WEB DEVELOPER”… to be. Soon; maybe.
But oddly, none of the job listings online say “Must have cloned ‘Instagram’ at least once” or “PHP is good but knowing your favorite ATOM THEME is better :)”
So you can make a rails backend, and you know what asynchronous means but there is a big hurdle left to leap. Design. The big D. A quintessential part of the internet that is often left for developers to discover on their own. Design is nuanced, fickle, and intimidating to approach. Below are some important tidbits to help approach this prickly beast.
You are not married to your ideas
Maybe that offset fuchsia div is finally resting where you wanted it but doesn’t look as great as you thought it would. Just because you worked to get it there doesn’t mean its right, and you are doing no one a disservice by scrapping it. Iterations of design are important.
Build your Style
Your first online portfolio, your boyfriend’s band’s website, and your sisters blog are not being manufactured in the Bauhaus. Their is no manifesto imposing rules to your practice and you are welcome to try whatever you’d like. Now is the time to experiment. Figure out what you dig, discover what you’re good at. Maybe it’s shooting reclaimed wood in and making it your landing splash that gets your blood pumping, maybe you’re such a CSS wiz that you’ll never make an AJAX request again. Test whats out there before you’re chained to a style guide.
~ STEAL / SELL ~
Don’t Copy Code
There are plenty of web tools that will ‘generate’ CSS for you and tell you exactly where to copy and paste it. Don’t do this. Figure out what their generated code is doing and re-write it. Copying CSS leads to becoming disoriented within your design and you will lose control. Control is a tenet of design and not to be jeopardized for a quick fix.
The Screen Is Your Canvas
There are a lot of things you need to give thought while developing code. Amongst all this focus we often forget that the thing we are working on is the screen. The internet may be our medium but it is manifested to the world on a screen. The screen is where you put the things are code. Sounds simple but this is important to remind yourself.
Speak Your Own Language
Imagine ‘organization’. If to you organization means three tall columns, design three tall columns. If its horizontal flash card divs, make horizontal flashcard divs. The designs that resonate with you are the designs you will execute the best. This doesn’t mean you have to stick to what you know, but know what you are sticking to.
Less is More
Simple pairings of color can have monumental effect on the vibe of a website. Luckily, there are docs for color: The Color Wheel. Use it. Here is a great tool for implementing the color wheel:
After finding your harmonious color scheme, maybe you want to splash an accent here and there. Remember that accent colors should be allowed to remain special. Use them sparing.
Be Aware of Media Interplay
Remember when you would go on a website in 2002 and it would start playing midi on load? It usually sucked, was annoying, and the first thing you would do is leave or mute it. There is a staggering amount of technology we can render on the page. Only use what you need. If the point of the website is the get people to zombie-scroll and spend money, you probably should not place a 6 minute video on the landing page. If the website is to track packages in the mail maybe the user should not scroll through 6000 pixels of parallax animations to get there. Pick the right tools and implement them.
Know Your Terrain
You may not have mastered Three.JS. You may have not even touched it. The concept of 3d modeling might completely bewilder you. But, if an employer asked if you’ve ever dabbled in 3d development, knowing the word ‘Three.JS’ is at least a step in the right direction. Click around, track new technology. Keep a list of things you want to learn. Like check this shit out:
These dudes are so futuristico even their url is high-tech outta control
ANYWAY — practice, build, repeat. Good Luck!
→ This is a fun helpful game that teaches CSS selectors: http://flukeout.github.io/