19 ms·
Building a Kickass Portfolio
- yathern 8y agoMinor point - title needs s/porfolio/portfolio/
- dang 8y agoFixed. Thanks!
- ghostbrainalpha 8y agoI love the general idea of not just saying what you should do, but also showing the first two iterations of the site and talking about what didn't work.
- cheez 8y agoThat's a great portfolio.
- petepete 8y agoI thought .tel domains were restricted to the publishing of contact information rather than websites. Portfolio looks great though!
- servercobra 8y agoThat's a nice looking site! Minor bug: When viewing from the home page to About on Safari at 1080p, your profile picture is squished horizontally. Refreshing fixes it.
- aspit 8y agoThanks! I (at the time I wrote it) didn't focus on making it Safari compatible, but I really should go back to that!
- kickscondor 8y agoI'm always looking for personal sites that are still out there. I love some of the ones she listed. Here are some random ones I found yesterday. http://merkoba.com/ http://merkoba.com/ http://angusnicneven.com/ http://angusnicneven.com/ http://danieltemkin.com/ http://danieltemkin.com/ http://joelcalifa.com/ http://joelcalifa.com/ https://jacky.wtf/ https://jacky.wtf/ https://www.jacobyyoung.com/about https://www.jacobyyoung.com/about http://nik.works/ http://nik.works/ http://web.archive.org/web/20180501202224/https://shiba.computer/ http://web.archive.org/web/20180501202224/https://shiba.comp... Here are two I found several days ago, but that I am still finding amusing today. http://coolguy.website/ http://coolguy.website/ http://leonbambrick.com/ http://leonbambrick.com/ Please share your personal page links, too. Even if this list becomes long, that's okay. I will look at it.
- rectangletangle 8y agoThe animation on http://merkoba.com/ http://merkoba.com/ hurts my brain.
- throwmenow_0140 8y agoEvery time I hear the phrase: https://youtu.be/evlrs5Bi_6E?t=1m25s https://youtu.be/evlrs5Bi_6E?t=1m25s
- volkk 8y agopersonally, i like nik's and jacobyyoungs the most. straightforward and to the point. merkoba makes my eyes hurt and as impressive as joelcalifa's background is, i dont like that its written as if to be read by 8 year old children.
- s73v3r_ 8y agoI've been gathering some inspirations for a personal site. Here are a couple I liked. (Although now that I think about it, these were linked at the end of the article). http://julia.im/ http://julia.im/ http://joelcalifa.com/ http://joelcalifa.com/ http://nik.org/ http://nik.org/ https://flexdinesh.github.io/ https://flexdinesh.github.io/
- 8y ago
- kermittd 8y agoI’ll throw mine in the ring: http://kermittdavis.com http://kermittdavis.com
- rozgo 8y agohttps://rozgo.github.io/ https://rozgo.github.io/ I try. Dynamical systems engineer is difficult to describe with text.
- nixpulvis 8y agoI'm thinking about moving my site off GitHub pages to allow for some more interesting kinds of features (with a DB), though in general I strongly believe that sites like a personal blog or portfolio should be as lightweight as possible.
- gbear605 8y agoReally cool article! Ironically, the portfolio site appears to have a console error. Whenever the background is clicked on (to create a shape), it logs "> p5.js says: color() was expecting Number for parameter #0 (zero-based index), received p5.Color instead."
- mendelk 8y agoPretty cool concept on Timo Becker's site[0] (linked in TFA), and I'm trying to figure out how it's accomplished. If memory serves, there's 6! = 720 distinct graphs. Was a custom illustration created for each of those? Either way, really nicely done IMHO. [0] https://timobecker.com/ https://timobecker.com/
- gumoro 8y agoI was wondering the same, but I thought the number of illustrations would be 7!/2 = 2520, that is, the number of permutations for 7 different elements, divided by 2 because symmetrical sequences generate the same drawing. Is it incorrect? How do you get "6!" ? 720 custom doodles seems doable, 2520 seems a bit much, so I suspect my reasoning for 7!/2 is wrong :) Edit : oh, I see how for all closed paths all 7 permutations are the same so we can divide by 7 for closed paths, but there are still the open paths... hmmm (still pondering) Edit 2 : aaaah, got it, I did not notice he was always closing the path himself... tss that's cheating :)
- Lanzaa 8y agoYep, in the code there are 360 unique drawing references. 360 = 7!/(2*7) 7! different ways to choose a closed path on the seven nodes. However, it doesn't matter which node you start on, so divide by 7. It also doesn't matter which direction they are chosen in, so divide by 2.
- mendelk 8y agoI believe you're right! Now that I've publicly displayed my ignorance, I discovered this message in the console: > Curios how its done? We are using paper.js and gatsby.js. Some behind the scenes: http://volligohne.de/projekte/timobecker/ http://volligohne.de/projekte/timobecker/. Check out the source code https://github.com/voellig-ohne/timobecker https://github.com/voellig-ohne/timobecker Sources for drawings: https://github.com/voellig-ohne/timobecker/tree/master/components/logo/paintingsSingle https://github.com/voellig-ohne/timobecker/tree/master/compo... I can't say that I'm any less impressed that it's "only" 360 drawings :)
- Kagerjay 8y agohttp://vincentmtang.com http://vincentmtang.com is mine My site sucks though, I haven't had time to update it unfortunately. I still have about 50-100 blog posts I have on backlog I want to write about. My train of thought is writing (or making videos) is more important since I want to capture things that happen in my life, and my adventures of screw ups and learning experiences. You can always make your portfolio later.
- Hasz 8y agoI use my site mostly as a personal log, with an emphasis on simplicity. Excluding pics, almost everything is <100KB https://ethanmye.rs https://ethanmye.rs
- terkel 8y agohttps://terkel.com https://terkel.com My old website (2016) is super outdated and lack real content, but it's creative and works. The source code: https://github.com/terkelg/terkel.com-2016 https://github.com/terkelg/terkel.com-2016
- J-dawg 8y agoAnyone else find it depressing looking at all these awesome portfolio sites? I’m a halfway-competent frontend developer who can build most things when I’m given a design, but I can’t imagine ever coming up with a cool quirky idea like this by myself. Where do you even begin?
- pixelbash 8y agoIf the designer I share an office with is anything to go by a key part is spending a good chunk of your day looking at other peoples designs..
- namanyayg 8y agoAs pixelbash said. You have to keep looking at new inspiration, and your subconscious mind will ruminate on it to give you interesting new combinations & ideas.
- abledon 8y agoFind a website design you like. Find a comic / movie / art piece you like . Smash the two color scheme / designs aesthetics together . Most creativity is smashing together previous stimuli into new things. Creative people can just do it a lot more easily and unconsciously like a muscle reflex Edit: lol even one of the other repliers is called ‘pixelbash’
- deleted 8y ago[deleted]
- J-dawg 8y agoThanks, I appreciate the idea! I think part of the problem is believing I can do it, I’m not sure how to overcome that
- Jarwain 8y agoI read your comment, wanted to reply, didn't know what to say. I moved on, ended up reading a speech by Neil Gaiman[1], with a quote that reminded me of your plight. > Someone asked me recently how to do something she thought was going to be difficult, in this case recording an audio book, and I suggested she pretend that she was someone who could do it. Not pretend to do it, but pretend she was someone who could. She put up a notice to this effect on the studio wall, and she said it helped. [1] https://www.uarts.edu/neil-gaiman-keynote-address-2012 https://www.uarts.edu/neil-gaiman-keynote-address-2012
- deleted 8y ago[deleted]
- asimpletune 8y agoI think the most important thing is to focus on original design, and to treat said design as solving a problem defined by constraints. While most of my site has the feature flags disabled (still working on content), I’m really happy with the design! It was really hard and it took a lot of work, but in the end I think it turned out very original and authentically me. https://asimpletune.github.io https://asimpletune.github.io
- HugoDaniel 8y agoah! https://hugodaniel.pt https://hugodaniel.pt :D
- throwawayaway12 8y agoI am curious if anyone has advice/tips for getting a simple portfolio up and running. I am a physics phd student who has worked on a few side projects that I would like to showcase. I am looking into Jekyll and hosting it on github, but I am not sure if this is ideal for a simple static site.
- lbotos 8y agoSeems great if you are comfortable with Jekyll. If not, find one that you grok and go from there.
- MikeKusold 8y agoYou can setup Gitlab for hosting as well. I use Gitlab CI to build my Hugo site, then Gitlab also does the hosting. This approach gives a lot better flexibility than Github's standard Jekyll.
- edhu2017 8y agoDepends on how simple you want to get. If literally displaying text once in a while, you don't even need jekyll. If you are a blog writer, want some sort of templating / reusable snippets, or want cool themes then jekyll is good.
- aspit 8y agoGithub pages is awesome, I would only do Jekyll if you want to host a blog though, otherwise its overkill.
- kelvin0 8y agoI'm an (veteran?) Software Dev with close to 20 years experience. I've never had a portfolio, I always thought a resumé and a list of successfully completed projects was enough. HR usually only looks at resumé, freelance customers usually couldn't care less of it seems. Only devs would care about another devs portfolio (in my opinion). Any other opinions?
- eafkuor 8y agoA portfolio seems pretty useless to me if you have a decent CV.
- nfriedly 8y agoI don't think it's a requirement, but I'm pretty sure mine's helped me get hired, both for freelance and full-time gigs. I've definitely had interviews where it seemed like they were already sold on me before the interview even started. > Only devs would care about another devs portfolio (in my opinion). It's often devs who perform some of the interviews ;) Also, my portfolio has quite a bit more content then you'd ever want to put in a resume. I don't feel like there's any need to limit it to 1-2 pages, so it has 90+ projects with pictures and 1-3 paragraphs of text describing each one. I think that has to have some impact, even if only on a subliminal level.
- h4b4n3r0 8y agoFrom my past life as a hiring manager: having a portfolio (or better yet a demo that you can show during your interview) helps junior hires a lot. It helps in 2 major ways: 1. I can see that the junior hire actually _did_ something worthwhile in addition to their mandatory coursework 2. It creates a topic for discussion that is: a). more comfortable for the candidate and b). more revealing about their work-related traits. It's a win-win. For senior candidates I just look at the track record. If they have a relevant project on e.g. GitHub, I might take a look, but it's not going to sway anything in a major way unless it happens to be exactly the domain expertise we're looking for, which happened only once. That's a small company though. A large company will not even look at your portfolio or GitHub unless you're a GitHub superstar of some sort, and maybe not even then. There are several well publicized stories when people who drive huge projects on GH failed to get an offer from FANGs of the world. The best dev we hired though, had nothing on github and did not have a portfolio. He just wrote code three times faster than anybody I've ever seen and without any bugs.
- ZainRiz 8y agoI've got a pretty minimalist one: www.zainrizvi.io Just realized I need to update my bio to now say I'm working at Google instead of Microsoft
- pknerd 8y agoBeing a backend developer I am not quite good at making a good looking portfolio. My current site(http://adnansiddiqi.me http://adnansiddiqi.me) home page is the inspiration I took from some other site. All links are clicked by visitors but the blog one. Although my blog gives me more traffic(and work) than the actual home site. Will seek her advice for sure. PS: In case if one wonders what I mean, check this Googe Analytics heatmap for my home page: https://imgur.com/a/swtufo9 https://imgur.com/a/swtufo9
- aspit 8y agoIt's the ordering! I would put Blog first, and change this to a two-row layout. The first row with internal links, the second row with icons of your social sites.
- r3bl 8y agoToo many links man, too many links. And a weird location of the blog link. I would usually expect it to be the third link (home -> about -> blog -> contact -> everything else), not sixth. You could reduce that list by three by showing another list with icons instead of the name (GitHub, LinkedIn, email).
- pknerd 8y agoThanks for your input. Will try it for sure.
- mkoryak 8y agofeedback please: http://dogself.com http://dogself.com
- fogleman 8y agoSome of my work: https://www.michaelfogleman.com/ https://www.michaelfogleman.com/
- kotrunga 8y agoThanks for sharing! Your projects are awesome.
- pletnes 8y ago1. Be a frontend developer 2. Draw the rest of the f* owl
- pmiller2 8y agoSeriously. What’s a backend developer to do?
- aspit 8y agoMost of my career has actually been on the backend! Just keep the site simple!
- vxNsr 8y agoNot to diminish, but by most of your career you mean 2 years, right? Because you say you graduated from college with a BA in 2016. Truth be told that makes this much more impressive...
- aspit 8y agothree -- I was working full time as a software engineer for the year before that. I also had two internships before that which I don't list.
- davidsawyer 8y agoI'll toss mine out there as well: https://www.david-sawyer.com https://www.david-sawyer.com Written from scratch. Just wanted to keep it simple and straightforward. It runs on a $5/month DO box.
- dudul 8y agoThat's funny. When reading the title I was expecting a post giving tips to build good content for a portfolio (e.g. what kinds of project should be highlighted more than others, how to balance different skills, etc), but it exclusively focuses on styling/designing the website. Nobody else in the comments seems surprise so it's probably me :)
- Sytten 8y agoTotally agree with you, my portfolio is my github. I don't need fancy graphics to show I am a good engineer, just look at the code I wrote.
- wicker 8y agoI’ll throw mine in the ring: http://jennerhanni.net http://jennerhanni.net I started out on Jekyll on Github Pages because I needed a place to put photos and I don’t use Facebook, Flickr, Google Plus, etc. It’s super simple, serving the photos on Smugmug for a yearly fee, and it works just fine for friends and family when I send a direct link. It feels manageable in a way that social media (for me) often doesn’t. I’m moving from hardware to software and it’s been a struggle to organize my resume and portfolio. I’m pleased with how it looks now with the sorting by category. And, of course, I had to go and get a writing hobby where nobody wants you to post anything online because they want first publishing rights. So I have a page where I guess I’ll just list things I’ve exhibited or published when I really want to post the poems or articles themselves. It’s the writing version of “but the client insists this remain closed source” when I just want to share and geek out about everything I make. :(
- myf01d 8y ago>this entire thread
- tkrupicka 8y agoMine is more or less a flexible CV which expands to give more details as necessary: http://tylerkrupicka.com http://tylerkrupicka.com
- Sytten 8y agoComputer Eng. student here too! Nice portfolio :) Just to let know you have a typo in the intro: "engieering".
- ogou 8y agoFrontend dev, content marketing in the API space, and multimedia art https://lucidbeaming.net/ https://lucidbeaming.net/ No CMS. Just a single pager with some JSON config.
- deleted 8y ago[deleted]
- rudolfwinestock 8y agoHere's my site: http://www.winestockwebdesign.com/ http://www.winestockwebdesign.com/ It used to be in AngularJS, now it's vanilla HTML & CSS. Mostly typography with just a little bit of animation.
- sieabahlpark 8y agoGoing to be honest, it doesn't look great and I don't think it shows off any designer skills you may have.
- sxp62000 8y agoI'm a designer 70% of the time, but I also do a lot of front-end, and iOS development work. Don't know how to show a combination of design and dev-only projects without confusing clients. Anybody have links to example portfolios that solve this problem well?
- aspit 8y agoYou could do two tabs, I have the tab for speaking and the tab for projects -- you could do a design tab and a code tab!
- k__ 8y agoPretty cool! I basically gave up on this, because somehow I never finished my private projects.
- KennyCason 8y agoThis makes me wish I took more screenshots of my old websites. My personal sites have had some very fun evolutions, including some outrageous styles/themes. May have to checkout the Wayback Machine. I’ve migrated from Wordpress, to rails, to Hakyll, and finally to my own static site generator in Kotlin, Kakyll. :) My most recent change which significantly improved traffic was making it mobile friendly. Im also no in the process of making blog content fit to percentages of the page instead of absolute pixel size. My one issue is that I’m always a bit concerned that my first page is a wall of blog post titles... not the most pretty. feedback welcome: http://kennycason.com http://kennycason.com
- aspit 8y agoI like it -- I would make the font a little bit bigger so it's easier to read. I just did a few tweaks on it https://imgur.com/a/OfFruwF https://imgur.com/a/OfFruwF and I think its a little easier to read -- just changed font to "sans-serif" increased line height and font size to 1.25rem.
- KennyCason 8y agoThanks a lot, and double thanks for the specific feedback! Will incorporate. :)
- interactivecode 8y agohttps://www.stefkors.com https://www.stefkors.com
- andrew_wc_brown 8y agoI always ask people if they looked at website, my code or anything before hiring me and the overwhelming answer is no. I've always had to get things in front of people just get them to see the extent of work. People think you need a portfolio to get hired you don't. I've built over 30 web-apps in the last decade, and I've never bothered to screen cap them. People only care what you can immediately do for them and if its not 1-to-1 with what they want they don't care. Its sad but its true.
- alexpetralia 8y agoBring a color-print out of your projects. This worked wonders for me when I was applying to jobs. For reference, my website is here: https://www.alexpetralia.com https://www.alexpetralia.com. I printed out the first page, then could talk about each project quite tangibly with the print-out in hand. You still need a portfolio, you just also have to SHOW it. It is your job as an applicant, not theirs to research every candidate that comes by.
- ace_of_spades 8y agoVery nice portfolio, thank you for sharing! I do have a somewhat unrelated comment, though. Looking through some of the examples, I have found an analysis of charity „effectiveness“ where effectiveness is defined very simplistically as the amount of money directed to the cause. I just want to highlight that this kind of measure does not tell you much about the real life effectiveness of charities in terms of how much GOOD they actually do because the effectiveness of causes/interventions themselves vary wildly per charity. For example, there is an organization called playpumps international which has likely worsened the life of villagers where they sponsored complicated water pumps that required kids to play on them to produce water compared to simple water pumps that looked less fun but could be used without this effort. Compare this to the Against Malaria Foundation which has consistently shown to be able to save lifes by costeffectively distributing treated bed nets in rural areas of Africa. For donation recommendations have a look at www.givewell.org or for more general information about the topic, check out www.effectivealtruism.com If you are totally awesome you could also consider to update your project with references to these websites and if you should use this project in a future pitch shine with great evidence and expertise on the topic ;)
- balls187 8y agoAre portfolio sites specific to designers, and/or what used to be known as Web Devs?
- aspit 8y agoCareer-wise I'm a mostly backend software engineer whose done some data science-y stuff. Just think its fun to build sites like this, and I do a lot of speaking/blogging now, so its good for that!
- ohmatt 8y agoJust a heads up, your Simon Says project on your personal page doesn't seem to work properly (Chrome on Windows). Every time I click start, and then try to follow it, it just resets.
- aspit 8y agoAh weird -- it's working for me. It was definitely an hour and a half long "I'm using a queue data structure in real life" experiment. Thanks for the heads up!
- philipmjohnson 8y agoI teach software engineering to about 120 undergraduates a year, and require them to build a professional portfolio during the first week of class. I used to have them use WordPress, but the results were very uneven. To enable them to focus on content until their skills were sufficient to create a non-embarrassing custom design, I created the open source project TechFolios: http://techfolios.github.io/ http://techfolios.github.io/ I've just finished a MVP of a desktop app in Electron for creating TechFolios called TechFolio Designer: http://techfolios.github.io/designer.html http://techfolios.github.io/designer.html I would be interested to know of similar sites/approaches.
- spyhi 8y agoOh hey Dr. Johnson, fancy seeing you here! Here is an example of TechFolios in the wild [1] which I built while I was in his class. https://spyhi.github.io/ https://spyhi.github.io/ (I’ve let it fall a bit out of date since the class, but this thread is good inspiration!)
- rainonmoon 8y agoHey, this is pretty nice! The grey in the nav bar is a little severe for my taste but I really appreciate that it loads fast even on my mediocre connection. Seems like a neat tool.
- ngold 8y agoNice work. I'm replying just to bookmark this and look into it further. Thanks.
- wongma 8y agoDid you know you can add comments to a favorites list? Click on the comment's time stamp, e.g. '3 hours ago' and on the next page there will be a 'favorite' link right above the comment.
- whatever_dude 8y agoI'm someone who focuses on UI and loves animated work, and... I can't stand portfolios that try to be _cute_. Some of the example portfolios on the linked URL are examples of things I don't have patience for, and that I really think are objectively not good. If I'm judging someone's work, I want to see that someone's work, and nothing else. Having an esoteric interface doesn't help. Most people can create something profoundly artistic and nearly impenetrable when they're doing it for themselves. What you do when you have _someone else's_ goals in mind is what counts. To me, trying too hard and creating something _too_ artistic normally means the person doesn't have a lot of experience.
- TK85 8y agoWould love some feedback too: http://portfolio.zehfernando.com/ http://portfolio.zehfernando.com/
- sajattack 8y agoI'd be grateful if anyone had any feedback on my portfolio https://paulsajna.com https://paulsajna.com
- misterxi 8y agoI have a very minimal site where I post some stuff now and then. Feedback welcome :) https://sivasubramanyam.me/ https://sivasubramanyam.me/
- kayman 8y agoAs someone who has been on both sides of the coin. My take is: Don't make your site for anyone and everyone. Keep a target audience in mind. Most of the time, the person that hires you is usually the target audience. Don't try to be too cute. For example, I have seen sites/resumes where the whole thing looks like HTML tags. My first impression is "cute" but it makes it hard to read as you try to gather real information. Most of the time when someone is looking at your site, they are asking themselves: - Who is is this person? - What do they do? - How much will it cost me. (Does it look expensive, cheap or reasonable what tier do they fall into. ex: Dominos pizza or Gourmet Pizza) - Have they done any projects that are similar to what I'm looking to get done. - Are they competent - Do they look like someone I enjoy working with. (energy, attitude, views...)
- _jsdw 8y agoHere's me: https://jsdw.me https://jsdw.me I am proud to have maybe the slowest css animation ever used so that, if you wait several hours, you'll see the clouds move across the screen :D
- pypanta 8y agoMy PS: https://pypanta.github.io/ https://pypanta.github.io/ I built it using CSS grid. It's not yet all finished, but now, I have more experience with CSS grid ;), so maybe I need to rewrite some parts again. And also, now CSS grid have a better support across browsers.
- pascoej 8y agoMine is very simplistic, but some of the pages load slow because I haven’t optimized the images. http://pascoe.pw http://pascoe.pw
- firefoxd 8y agoI totally ripped off google[1] . I'm working on a facebook, and YouTube one, because why not. [1]: http://www.ibrahimdiallo.com http://www.ibrahimdiallo.com
- deleted 8y ago[deleted]
- rwieruch 8y agoMy personal site where it is more about blogging than a personal portfolio: https://www.robinwieruch.de https://www.robinwieruch.de :)
- snipesq 8y agoJust started
- sizzle 8y agoI need a crash course in personal branding and selling myself, any good resources? Thanks!
- megacolorboy 8y agoHave a look at my portfolio: http://megacolorboy.esy.es http://megacolorboy.esy.es It's built from scratch and aimed to give a paper-like feel to it.
- ataturk 8y agoKinda glad I'm closing in on retirement.
- deepaksurti 8y agoMichael Fogleman has a kickass representation of his work [1] with a good discussion on HN [2] I think what his portfolio shows is the importance of doing well scoped projects on the side and finishing them, which includes a succint representation on his portfolio. Very inspiring, thanks for sharing Michael. [1] https://www.michaelfogleman.com/ https://www.michaelfogleman.com/ [2] https://news.ycombinator.com/item?id=14445587 https://news.ycombinator.com/item?id=14445587.
- fvcproductions 8y agoYou can find mine at https://www.fvcproductions.com https://www.fvcproductions.com. It has scores of 100 on Lighthouse for everything except performance (98). I still need to get rid of pagination on mine but based on what I've seen so far, I would be interested to see what percentage of these websites are highly performant/mobile-friendly. I have a Raindrop.io collection of all the personal websites I think are amazing: https://raindrop.io/collection/1553680 https://raindrop.io/collection/1553680