Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Michael Cook
Full Stack JavaScript Techdegree Graduate 28,975 PointsHow should I design my first portfolio site as a back-end developer with no design sense?
I am an aspiring back-end developer. I have written some basic website projects and I am fairly comfortable with JavaScript, PHP and HTML and to a lesser extent comfortable with CSS. Bootstrap is what I run to for laying out a page. I am getting to the point where I want to start focusing my energies on making some portfolio projects, but I need to build a portfolio site and I have absolutely no design skills. Are there are templates or resources anyone else used or could recommend? I am just at a loss as to how to design the look and feel of my first personal site and this has been a major barrier to creating it for months now.
Michael Cook
Full Stack JavaScript Techdegree Graduate 28,975 PointsI have learned CSS Grid and Bootstrap. I have no problem coding out a design. My problem is design sense. I have the technical ability but lack the ability to envision a design that looks and feels good.
justin s.
1,009 PointsYou don't. You're an aspiring backend developer. You're not front end. You're not a designer. You're a backend developer. No company cares about your design skills or front end coding skills if those aren't the jobs you are applying to. It's not your job as a backend developer to do any of that stuff.
"But how do I show I built the backend for such and such?"
Find a project that needs the backend worked on, and offer up your skills.
5 Answers
David Moorhead
18,005 PointsHello, Michael Cook,
I like Barbara's ideas, and, since I began writing this response yesterday without posting it, today I feel free to throw my hat in the ring.
There's more to layout and design than what's been discussed so far in here. I'm writing this post with several years of graphic web design behind me. I'm primarily a purist with CSS Grid, these days; I've included JavaScript occasionally, and more frequently, Flexbox snippets.
You've said:
I am just at a loss as to how to design the look and feel of my first personal site and this has been a major barrier to creating it for months now.
May I suggest your design capabilities have been invisible, as if they've been trained to reside backstage? You know, just waiting for the curtain to rise so they can walk front and center.
Many people use these words, layout and design, interchangeably. Let's focus for a moment on some easy distinctions, if you will.
Layout is the placement of elements, div's, classes, as examples, while imagining where selected images might be placed, what colors might be used, or which fonts might be best.
Design is the placement of images, and probable colors and typography later coded to distinguish one set of elements or classes from another, for instance.
It's been my experience that most web developers aren't confident designing with color. If I have presumed wrongly on your behalf, my apologies. I would think that inviting someone who's good with layout and color distinctions for this and that could help by being with you elbow-to-elbow at a computer for two or three sessions, say.
I love this Adobe Color Wheel. Web Content Accessibility Guidlines provides an easy check for contrast ratios; that is, ratio of background color to text color.
Like Barbara mentioned, "...keep it simple. It will evolve." There are numerous template sites, all of which have been unoccupied by me. However, these two might help by providing a good jump start for offering layout and design options for your portfolio page.
Most notably, you may want to keep in mind responsive and accessibility. Just a thought.
David
Michael Cook
Full Stack JavaScript Techdegree Graduate 28,975 PointsDavid, thanks so much for your thoughtful response. It is possible that I could learn to do some design work if I were taught from first-principles. I certainly don't have the artistic talent to pick it up without instruction though.
barbara gunion
2,485 PointsEveryone has a design sense. How do you shop for clothes? There are "rules" that can make it simpler for you. Lynda has some videos. Or google UI/UX/website design for videos and free courses. After looking at the videos start browsing through website templates and make a note of what you like and why you like it. It takes practice but I guarantee you have some sense you just aren't aware of.
Also, building a portfolio is tough for everyone. Use the rules and keep it simple. It will evolve.
Michael Cook
Full Stack JavaScript Techdegree Graduate 28,975 PointsThanks for your answer Barbara. I'm surprised with how much effort people put into their responses for my question and I will be sure to follow everyone's advice. Lynda is great, and Treehouse also offers a lot of design courses as well.
barbara gunion
2,485 PointsFor my personal career goals I am looking at this site. This may be interesting to you as well. https://www.rookieup.com
Mister Moody
48,333 PointsNot much you can do about that other than staying on the grind my friend!
Mister Moody
48,333 PointsI too need to improve my design aesthetics, but I view that skill as an inherent gift! Lol.
barbara gunion
2,485 PointsA gift everyone gets! And a talent that is cultivated. Just like coding it comes more naturally to some but that doesn't mean you cannot cultivate it. It is natural to be creative as kids but then it is usually driven out by school and culture etc. Believe me... I used to teach a drawing course that is targeted to all. You have it in you or you would not have chosen web development. In web design there are more stringent rules that create a structure that is easier to learn. That is where you start. Keep it simple like using one font and just 2 or 3 colors. Here is a nice example of applying rules to colors: https://www.smashingmagazine.com/2016/04/web-developer-guide-color/
justin s.
1,009 PointsWhy do you NEED to? Is your goal to be a designer? If not that'd be like an aspiring plumber saying they need to improve their carpentry skills.
Mister Moody
48,333 PointsMister Moody
48,333 PointsI would suggest spending a day or two to learn CSS grid. If you do not want to learn anything about design, try using a framework like Bootstrap or Flexboxgrid.com. Simple learning curve tool that will allow you to create a simple layout for a portfolio with perfectly aligned column and rows (versatile enough to create a masonry layout).