13

Briefing:

I'm a self-taught web developer with about 4 years of programming and design experience. My list of closed projects includes - complete websites from scratch, network-based web applications, and a few website designs for which I haven't done the programming. I'm trying to build an online portfolio that I can easily share with potential clients in the future and have everything in one convenient place where I'm in complete control.

My Research:

Based on what I've seen around the web, most web developers showcase screenshots of their work along with a description of the project, a few relevant details, and links to the actual website or web application.

The Problem:

With all honesty, some of my design work is not very flattering (to me at least) but those projects are still very important to me as some of them were done for major companies in Kuwait albeit on strict time-restraints. Also, as I mentioned earlier, some of my projects are network-based and are only accessible from within the company thus I cannot provide links to them. Additionally, I have a group of web applications that use the same design and interface so screenshots are not very convincing in this situation. I also recently found out that a company for which I build a website for back in 2010 has had their hosting account suspended for not paying. I don't want my future clients to jump to false conclusions based on something I had nothing to do with so I can't have a link for it either. That leaves with very few websites that are currently accessible to the general public and that bothers me. Despite numerous attempts, I don't seem to be able to decide on a good way to showcase my available work professionally with the said limitations above. It's driving me insane! I've been at it for some time now! Please help!!!

  • Very similar (but not quite a duplicate) here: freelancing.stackexchange.com/questions/719/… – Canadian Luke Oct 6 '13 at 15:23
  • 1
    Good question - if I understand correctly, you're facing the problem many developers face: portfolios don't really work for code. – Tim Lytle Oct 7 '13 at 0:22
  • @Tim - Thank you! Indeed it's a topic not often discussed in a general manner. In my case, I'm lucky because I have interfaces to show for it but if my work was only programming, that would've made it much more difficult, in which case I would probably resort to Github or something similar to show off my source code in some way. Not to mention that showing screenshots of interfaces made by someone else would give the inexperienced clients a false impression that I also do design for example. – M. Tahan Oct 7 '13 at 0:55
  • @MahmoudTahan Exactly. When I get a chance I'll try to add an answer from my perspective (I don't do any design). – Tim Lytle Oct 7 '13 at 0:57
  • @Tim - Yes yes! Please do! I'm excited to know how you would go about it so we can have a better idea of what to do in case we have programming-only projects. Thank you! – M. Tahan Oct 7 '13 at 1:02
13

The best advice I can give, as this is precisely the issue that I faced, is to build yourself a website that will act as your portfolio and let that website itself act as the showcase piece that shows off your talents.

You can include a projects area in which you can add screenshots to those websites that you are comfortable showcasing and (very importantly) that you have permission, or can get permission from the site owners, to showcase. I was threatened with legal action from a former employer because I included screenshots of their website on my portfolio without their express consent. Don't place yourself in potentially difficult situations simply to highlight some of your work.

Alongside each project (with or without screenshots) you can detail your exact involvement and achievements within the project. If you build the website yourself from scratch, rather than simply using an off-the-shelf CMS package, you can ensure that it is built to the standards that you set yourself professionally. You could also use it as an opportunity for self-learning new technologies/frameworks that may be required for upcoming client projects.

If you can't actually get decent screenshots for specific projects you could include a section that talks about the technologies/techniques that you have used or the development process that you go through when building sites for clients. Anything that will convey how you can provide value to potential clients.

I would also advocate (if you don't already) including a blog on the same site. This is particularly useful as you are a developer, because it allows you to write articles that convey your interests and expertise. It should also draw traffic to your site which will enhance your overall web presence. You can either build the blog yourself, which could be useful if you're planning to build something similar for a client, or embed one from a 3rd party - there are plenty around, many of which are free.

7

As a freelancer and a client, I look for a 'genuine' person.

  • Don't hide behind a silly company name
  • Put your picture everywhere, doing all kinds of things.
  • Whatever you link to or reference, make sure it's updated/still live/has no bugs. Most portfolios are complete junk, and there's no reason for it.
  • If you have a Facebook/Twitter/Blog/etc, keep them up to date; otherwise, don't reference them, or close your accounts.
  • If you had all what I just mentioned, you would have been the only one while I was searching for someone to start on a project.

Best of luck. Just remember, go all in, or don't play at all.

1

You are correct, your goal should be first to take screenshots if you can, and always provide as much information as possible about your project. If your project is private, still include a logo, mockup, public facing site, anything you can.

I build a tool called DevPort that scrapes as much information as possible out of GitHub repositories, web pages, and apps and puts them into a portfolio for you.

For example, it will take a photo of a GitHub Readme, scrape the repo name, description, and the readme for any additional images. This way you at least have something to show.

See the GIF below for how you would take a screenshot of a webpage.

DevPort website import

It also scrapes the name, url, description, etc.

You can add multiple website screenshots to the same project by clicking "Import."

import projects

All the webpages are displayed in a portfolio. You can mask the fact you used a website builder by uploading your own html/css/static assets and binding your own domain.

example portfolio

  • 1
    Hi Ian, welcome to Freelancing! So that this answer doesn't look like spam, can you please edit it to include the relevant features, and maybe a walkthrough or example? Thanks! – Canadian Luke Apr 27 '15 at 16:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.