I 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.
personally, 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.
I'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).
UX is your specialty but you have no screen caps of your portfolio next to each project name.
If I want an overview of your work I need to click through each link, instead of simply scrolling through the page and then clicking on what I’m interested in. No offence, but that’s some poorly thought out UX right there.
Thank you for the feedback! Do you have examples of screen caps you like? I had considered this but decided to take it out because of wanting to keep to the old school terminal aesthetic. Plus since I do a lot of programming, I figured linking to the site to see how it works might be more useful than simply a screen grab, since I'm not the one usually doing the design (which would make sense at that point).
User experience and performance go hand-in-hand. Users get frustrated if a site loads slowly or doesn't function. So I made sure to have a site that does those things (plus web performance is one of my specialties).
I really love this use of shadow! It creates a fantastic appearance of depth. One thought: Since the shadow redraws itself based on cursor position, when you move the cursor off of the grey background container and back on in a different location, the shadow effect seems to skip. At first I thought the site was buggy/lagging. It might be worth it to extend the CSS/JS trigger to the entire viewable document, rather than just the grey box.
Awesome, thanks for the report. I had someone report that before and couldn't reproduce. Looks like I should have tested in base Firefox, not just Firefox Developer Edition :)
I also can't scroll at all in Chrome on Windows. If it helps, when I mouse over one of the underlined words like "developer" then the outside border goes orange and strangely enough I can scroll a bit.
Looks great. Setting a line-height of 2.7rem gave the paragraphs some more room to breathe, those thick underlines made it claustrophobic in there. They're also not really adding anything to the presentation other than to break up the monotony of bare text, with the colored onHover gives the appearance of a link but then you get disappointed when they don't function that way. I'd pick some other way to highlight the words than underlining.
The email address at the bottom has too slight a color difference from the 'contact me at' part. Either make it contrast more or just make them the same color. The email address also gives the appearance but not behavior of a link.
Decreasing font-size on the non-bolded text on Recent Work to 1.1rem gives a better contrast with the headings.
Lowering the line height for the description text of the TwinThread blurb to 2.2rem makes the structure of the information more cohesive.
The lighting thing is pretty cute. But you have completely and totally broken scrolling.
(Or at least you have for OSX Safari 11.1.2. Two-finger scrolling on my trackpad does nothing, trying to drag the scrollbar does nothing, space and arrow keys do nothing. Clicking on the links does nothing either.)
Love this site! Watched a couple of the videos too, and you've got some great visualizations. I know you said that you're not great at explaining what you've done with words, but having a couple of lines that express to me (especially as a non-expert) what your contribution was for each video would serve you really well: i.e. the videos look cool, but I don't know what it was that you did that was hard.
This is reminiscent of windows93.net - but I like that this is a personal zine. It's easy to get distracted by the games and apps included, as if they are the primary draw.
Visit Start > Issues. What a novel way to do a blog type thing.
Nested iframes on that last one. Do you remember sites that would popup hundreds of popups - not virus/porn sites, but design sites that would orchestrate a variety of images in the popups? I recall iframes that would bring up more iframes as well. I wonder where we'd be if we'd followed these routes instead.
After 5 years of not having a portfolio, put one up earlier this year! https://moeamaya.com/. Interestingly my best project leads have come from launching the site.
Funny-- her site is very much not the same as mine, but there are several parts that certainly rhyme (shapes on the homepage, projects displayed in colorful wells, etc).
Thanks! I'm glad to hear people outside my existing fans like how Parallax looks; it's been brewing out of view for a couple years now.
(The site's a repository for about seventeen years of my creative output. You, too, can have something that mind-blowingly complex if you just keep at it for a significant part of a lifetime. :) )
How many blockchain projects have you done? Looking at the body of work you've shown, it all looks to be standard web projects - nothing at all wrong with those kind of projects, but when you put "web & blockchain solutions" at the top, it makes it feel like hype marketing.
I've helped out 4 ICOs with smart contract programming & web interfaces. I do not list them on my public portfolio, only present them to interested clients.
I built mine about 6 years ago, and it's starting to look a touch dated now, but I'm still pretty proud of it. It's helped me land my last two full-time jobs as well as a few freelance things here and there.
Seen some of this before, but glad to see it again.
Your site is well done - I particularly like the timeline overview of your life. Everyone should do one of those. I've been obsessed with 1995 era Yahoo/DMOZ link directories lately - your site reminds me of a little directory to your life. I don't know if you track heart rate and stuff like that, but I was honestly glad it was more of a summary than an exhaustive data dump.
Hey! Yes - well I found your blog to be gorgeous and I think it sets a standard for the Indieweb (which is generally very practical.) Which - I like that you don't sacrifice practicality for appearance. The layout of the metadata on your posts is sterling.
As a programming instructor, I'm always encouraging my students to keep beautiful, up to date portfolios. I appreciate the numerous examples in this thread, and will be sure to pass along the inspiration to my students!
Cool portfolio! Wow that time-shifted comment patent is cool stuff, doesn't every social video platform used time-shifted comments or does your patent cover a specific nuanced scenario within this space, cause it seems many companies do video streaming chat like the way the patent described e.g. twitch, Facebook live, etc.
your patent is an example of what's wrong with the software patent industry. i don't mean to be rude, although you did feature it promo prominently as the first bit of information about you on your resume. i mean, does soundcloud or any of the multitude of video websites that have done this for years have to pay you license fees?
The unfolding zine is neat! Some of the other zine links inn these comments should take note. The little pages within a larger HTML page really stirs up the ideas in a "hey dawg I hear you like pages" kind of way.
Should mention this is built on Ghost.org but is a 100% custom template. Used to use jeckyll with a Github page but with the microsoft takeover I decided to try something new.
Want something fun? Check out all the old designs with the Internet Archive! The 2010 design is a little... uh....
My personal site, made with hand-coded HTML and CSS, generated with Hugo, and published with rsync: https://www.simongriffee.com/
I use a couple of JavaScript libraries for displaying portfolio image galleries and the masonry-style blog list pages under /notebook/, but am thinking of reverting the latter into a single-column chronological format instead.
My old (handcoded starting in 1999, so ancient tech) site www.lomont.org. It now looks like 1999, so needs some serious updating, which led me to making www.clomont.com, in the hopes someday I will merge them with newer tech to make it easier to post articles.
Now I'm leaning on using or making a static site generator, needs markdown supporting math via some LaTeX flavored plugin, and simple to edit. Maybe one day when I'm less busy I'll get around to merging, updating, and posting the gazillion articles/talks/progs I've done that have gone unposted.
I find links by clicking on different Twitter users' links or clicking around on "indieweb" blogs. But today has been amazing - having a chance to look at a variety of designs and blogs shared by their creators.
These designs you linked are more modern than the others that I've seen. It made me realize that there is a lot of nostaglia - either utter minimalism or vaporwave - floating around in personal pages right now - which I do enjoy. But these go in giant page directions. Another good example in this direction is: http://aaf.nyc. It's not a long page, but has a large feeling.
Never knew that so many developers go to such extremes w.r.t minimalism.
The site you've linked has great videos in the background and I like the animated logo, that really helps in making it interesting.
Personally, I still prefer those sites I've linked, because I know that they are harder to make than those minimalistic/no-css sites. I think it depends if it's a backend dev or a full stack web dev with a focus on UI/UX. In the latter case, it's a good way to show off what you're capable of. With those minimalistic designs (some of them also have bad UX) I don't really know if they're able to create modern, responsive and more complex websites.
I have bookmarked the pastels blog entry to revisit - I think this is a fun post. Your blue puts you with the other link here https://moeamaya.com/ which is good company.
One question: is there a reason you chose to go with left-right arrows on the photo page and scrolling on the code page?
Thanks! I went with left-right arrows because that's pretty much the standard for fine art photographers and I did scrolling on the code page because I suspect that developers would get frustrated with the lack of information density. I feel weird that the photos are the odd page out, but I struggled with finding an alternative when I made this.
Nice site! I'm biased because I use my phone so much, but if you add in a viewport tag it'll look better on mobile. I just added one in the console and I think it still looks pretty good
Wow, thanks so much for pointing this out. I spent a day or two getting things mobile-responsive, but I couldn't figure out why certain mobile browsers didn't display the site as I intended. I added a little thank you in the README: https://github.com/iechevarria/iechevarria.github.io
As someone familiar with front-end technologies, I'm always surprised at how folks build such a thing. Wouldn't know where to start. Guessing it has something to do with css transforms to make boxes diagonals.
I like the small "highlights I’m proud of" section. It's a nice approach. To me it feels more, genuine, I guess? I always feel uncomfortable talking about what I'm good at. I really like how you frame accomplishments as something you are proud of without it coming off like a big marketing pitch.
Instead of reaching for an external library I decided to go with my own solution and I like to think that it made me more appreciative of Vue.js in general.
Boy, making a portfolio is excruciating. All these links make it look so easy, but when I started it was like pulling teeth. If anyone has feedback (harsh even), I'd love to hear it!
Just as a notice to everyone here, I am going to make a nice directory of these links at http://www.kickscondor.com/hrefhunt/. My previous "hunt" is there - but I'll make a new page there over the next day, archiving my old one.
Thank you for being generous with your links. I think there is a kind of resistance toward self-promotion of your personal pages these days. Or perhaps you feel like no one wants to see your page. Well, I do. I want to find pages that can't be found by Googling. One also has to look through every page to find the obscure pages that can be loved.
I would encourage all of you too to be curious about what is out there. There is still much to do on the web - it has just become very orderly in general.
The typing interaction was inspired from a site called Hacker Typer. I like how it invests the user in the sight by inviting them to interact immediately. (View on PC. It's non interactive on mobile)
Thanks. I'm pleased you mentioned the speed. When I created the site it wasn't something I focused on but I have thought about more recently. I'll aim for any changes I make to be at worse time neutral.
I like to think that if any future employers don’t enjoy my self-deprecating humor it probably won’t make a great fit anyway.
I used the site as an opportunity to roll my own static site generator for no reason. Bit of a whatever website, but it was a fun learning experience nonetheless.
Static site built with hugo, hosted on a 5$/month DigitalOcean droplet, using LetsEncrypt for TLS. Been considering some other hosting options that might be cheaper since I barely get any traffic, other than a couple times my posts went viral.
Huge respect to those that can consistently push out content. I have a big list of articles I want to write, but always lose motivation when it comes down to it. Maybe I'm a slow writer, it seems to take me an entire day to write something I'm proud to share.
Yes, S3 + CloudFront. I host a bunch of domains, including few whose properties/IP/company was acquired. The monthly for the static hosting is less than a dollar a month.
Cloudflare > CloudFront + S3 (sometimes just S3 responding to Cloudflare's request). I could have done Route53 but I've lots of other domains managed by Cloudflare.
I have a single instance Jekyll setup that spits out a bunch of index.html files for all the domains, including my primary personal[1]. To automate further, the setup runs within a few NPM modules, and gulp does the compile and build. When I need to change/update something, I let it build and then deploy to the primary S3 Bucket. The deployment is done with the S3_website[2] Gem.
Been running this setup for over 3 years or so. I can strip away everything and just stay with the minimal Jekyll setup and manually upload the files.
I'm most proud of the hover outlines, which I spent way too long making. They're on npm as a React component if anyone else finds them cool: https://www.npmjs.com/package/dynamic-outlines
A tad basic, but mine at https://www.jeremycantu.com tries to do the whole "multi-discipline" angle with that toggle in the center, which I thought might be a neat element for folks with varying creative pursuits.
I pointed out my personal website earlier in the thread, but later recalled I’ve kept archives of every major version going back to ~2000. They sort of capture trends over time.
I'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.
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."
I 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 :)
Yep, 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.
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.
Anyone 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?
As 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.
Find 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’
I 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.
Building a personal site is initially a design and time management exercise.
Set aside a few hours a night, and before getting into Vue.js, CSS, etc., jot down a list of pages, sketch out a layout, and gather inspiration for the visual style and any creative ideas you want to add.
I 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.
I 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.
Depends 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.
I'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).
I 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.
From 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.
I have it mostly for speaking and blogging purposes; however, I get a pretty decent stream of people reaching out to me over it which would be really cool if I were looking for a job! I think it also really helps candidates stand out.
Looking at all of these portfolios only serves to remind me that although I work in tech, I have very little in common with frontend devs in terms of what I think is good or interesting. Most of what has been posted as examples of 'these are great personal sites!' I find actively annoying.
I am not a stick in the mud. :) I just work in a different part of the field, and finding work has never been an issue. So do many others, and they're fine, too. I wouldn't worry about it.
Being a backend developer I am not quite good at making a good looking portfolio. My current site(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
It'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.
Too 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).
293 comments
[ 4.1 ms ] story [ 252 ms ] threadPortfolio looks great though!
"Now also available as a generic anything-you-want-it-to-be top-level domain" -- from the .tel site
Minor bug: When viewing from the home page to About on Safari at 1080p, your profile picture is squished horizontally. Refreshing fixes it.
http://merkoba.com/
http://angusnicneven.com/
http://danieltemkin.com/
http://joelcalifa.com/
https://jacky.wtf/
https://www.jacobyyoung.com/about
http://nik.works/
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://leonbambrick.com/
Please share your personal page links, too.
Even if this list becomes long, that's okay. I will look at it.
http://julia.im/
http://joelcalifa.com/
http://nik.org/
https://flexdinesh.github.io/
https://conradadam.com
If I want an overview of your work I need to click through each link, instead of simply scrolling through the page and then clicking on what I’m interested in. No offence, but that’s some poorly thought out UX right there.
What good is it that it ‘runs ultra fast’?
User experience and performance go hand-in-hand. Users get frustrated if a site loads slowly or doesn't function. So I made sure to have a site that does those things (plus web performance is one of my specialties).
Your link is well done. The blue and gray hearken to the Old Web.
Would love feedback on what works / doesn't work design-wise.
The words in the main paragraph are underlined but not links to anything? Make them link to something.
I can't scroll properly but i'm sure you will fix that.
Emphasize what work you actually did at those brands you listed.
The email address at the bottom has too slight a color difference from the 'contact me at' part. Either make it contrast more or just make them the same color. The email address also gives the appearance but not behavior of a link.
Decreasing font-size on the non-bolded text on Recent Work to 1.1rem gives a better contrast with the headings.
Lowering the line height for the description text of the TwinThread blurb to 2.2rem makes the structure of the information more cohesive.
(Or at least you have for OSX Safari 11.1.2. Two-finger scrolling on my trackpad does nothing, trying to drag the scrollbar does nothing, space and arrow keys do nothing. Clicking on the links does nothing either.)
https://rozgo.github.io/
https://coltonhurst.com/
And wow. Even more simple than mine!
Visit Start > Issues. What a novel way to do a blog type thing.
https://patrickcollison.com/
https://tomual.com/
http://halvor.work/
Mine is minimal because I refuse to make it otherwise: https://bernsteinbear.com
Any feedback is appreciated!
https://matthewhoelter.com
I'm mostly an artist, and I take delight in the aggressive unhipness of my site running on top of Wordpress. It's had the same front page since 2011.
Someday I should really change the menus in the blog/portfolio sections to work with touch browsers. I got comics to draw, though.
(The site's a repository for about seventeen years of my creative output. You, too, can have something that mind-blowingly complex if you just keep at it for a significant part of a lifetime. :) )
https://stolson.com
I love ASCII text a lot :)
https://nmn.gl/
http://www.nfriedly.com/portfolio/
I'm a fan of personal sites, too. Some of the ones that I like most, in no particular order:
https://macwright.org
https://zachholman.com
https://warpspire.com
https://paulstamatiou.com
http://francisco.dance
https://craigmod.com
Your site is well done - I particularly like the timeline overview of your life. Everyone should do one of those. I've been obsessed with 1995 era Yahoo/DMOZ link directories lately - your site reminds me of a little directory to your life. I don't know if you track heart rate and stuff like that, but I was honestly glad it was more of a summary than an exhaustive data dump.
Thankyou.
Here's mine: https://droxey.com
[1] https://productforums.google.com/forum/#!topic/youtube/uykx9...
http://moonbench.xyz
I'd encourage you to take a second look at the end of August, I'm very excited about the pending redesign and rewritten content.
http://bastijn.nl
http://bastijn.com
https://www.onirom.fr
https://harishnarayanan.org
https://chy.io
Want something fun? Check out all the old designs with the Internet Archive! The 2010 design is a little... uh....
https://web.archive.org/web/*/kolemcrae.com
I use a couple of JavaScript libraries for displaying portfolio image galleries and the masonry-style blog list pages under /notebook/, but am thinking of reverting the latter into a single-column chronological format instead.
May the independent web live long and prosper!
https://indieweb.org/
The ability to change things is one of the nice things about personal websites.
I am enjoying exploring kickscondor.com
Now I'm leaning on using or making a static site generator, needs markdown supporting math via some LaTeX flavored plugin, and simple to edit. Maybe one day when I'm less busy I'll get around to merging, updating, and posting the gazillion articles/talks/progs I've done that have gone unposted.
edit: I tried to keep it minimal but informative. I recently rebuilt it using Gatsby.
https://swapped.cc/
From the time when I had too much free time.
My favourites:
http://alexandrerochet.com
http://timroussilhe.com
Those are experiences. I'll update my website to be so awesome when I get some time for it (bit difficult while managing a team).
My own site, wanted to update it ever since. Not really an eye-catcher, I know. It uses Grav CMS, it's a great CMS (and file-based).
https://samuelantonioli.de
And the website of my agency (it's German)
http://funkhaus.io
Would love to hear some feedback, especially browser quirks.
These designs you linked are more modern than the others that I've seen. It made me realize that there is a lot of nostaglia - either utter minimalism or vaporwave - floating around in personal pages right now - which I do enjoy. But these go in giant page directions. Another good example in this direction is: http://aaf.nyc. It's not a long page, but has a large feeling.
The site you've linked has great videos in the background and I like the animated logo, that really helps in making it interesting.
Personally, I still prefer those sites I've linked, because I know that they are harder to make than those minimalistic/no-css sites. I think it depends if it's a backend dev or a full stack web dev with a focus on UI/UX. In the latter case, it's a good way to show off what you're capable of. With those minimalistic designs (some of them also have bad UX) I don't really know if they're able to create modern, responsive and more complex websites.
https://magical-girl.site/
I shared it a while ago here, but it didn't get much traction.
One question: is there a reason you chose to go with left-right arrows on the photo page and scrolling on the code page?
You are doing good work. Continue.
Tried to keep it simple
https://benjamintaylorportfolio.netlify.com/#/
Built with Vue.js and uses Wordpress REST API as a headless content management system.
https://benjamintaylorportfolio.netlify.com/#/post/lazy-load...
Instead of reaching for an external library I decided to go with my own solution and I like to think that it made me more appreciative of Vue.js in general.
Possibly a bit grandiose. Any feedback much appreciated.
Boy, making a portfolio is excruciating. All these links make it look so easy, but when I started it was like pulling teeth. If anyone has feedback (harsh even), I'd love to hear it!
Can I ask what you used to make that pixelated avatar of yourself?
Would love to hear your thoughts.
Thank you for being generous with your links. I think there is a kind of resistance toward self-promotion of your personal pages these days. Or perhaps you feel like no one wants to see your page. Well, I do. I want to find pages that can't be found by Googling. One also has to look through every page to find the obscure pages that can be loved.
I would encourage all of you too to be curious about what is out there. There is still much to do on the web - it has just become very orderly in general.
Static Site / blog made with Pelican and a custom theme, all open source.
It's hosted at my house on an old thinkpad 430 with a cracked LCD running SmartOS.
https://me.thatcoolidea.com
The typing interaction was inspired from a site called Hacker Typer. I like how it invests the user in the sight by inviting them to interact immediately. (View on PC. It's non interactive on mobile)
It's in need of some help so I've been looking around for inspiration. I'll be taking a look at everything posted. Some I've found previously I like:
http://blog.echen.me/ https://www.liyaoxiang.com/ http://www.randalolson.com/ https://jvns.ca/ http://www.nowozin.net/sebastian/ http://www.emilio.ferrara.name/ http://danielnee.com/ http://daynebatten.com/ https://thomaslarock.com/ http://treycausey.com/ http://mvjantzen.com/
I like to think that if any future employers don’t enjoy my self-deprecating humor it probably won’t make a great fit anyway.
I used the site as an opportunity to roll my own static site generator for no reason. Bit of a whatever website, but it was a fun learning experience nonetheless.
Static site built with hugo, hosted on a 5$/month DigitalOcean droplet, using LetsEncrypt for TLS. Been considering some other hosting options that might be cheaper since I barely get any traffic, other than a couple times my posts went viral.
Huge respect to those that can consistently push out content. I have a big list of articles I want to write, but always lose motivation when it comes down to it. Maybe I'm a slow writer, it seems to take me an entire day to write something I'm proud to share.
Cloudflare > CloudFront + S3 (sometimes just S3 responding to Cloudflare's request). I could have done Route53 but I've lots of other domains managed by Cloudflare.
I have a single instance Jekyll setup that spits out a bunch of index.html files for all the domains, including my primary personal[1]. To automate further, the setup runs within a few NPM modules, and gulp does the compile and build. When I need to change/update something, I let it build and then deploy to the primary S3 Bucket. The deployment is done with the S3_website[2] Gem.
Been running this setup for over 3 years or so. I can strip away everything and just stay with the minimal Jekyll setup and manually upload the files.
1. https://brajeshwar.me
2. https://github.com/laurilehmijoki/s3_website
I’m pretty proud of it, but I know things can always be improved. The portfolios shared in this thread though provide such inspiration!
Me - https://dcpos.ch
Paul Shen - https://bypaulshen.com
I'm most proud of the hover outlines, which I spent way too long making. They're on npm as a React component if anyone else finds them cool: https://www.npmjs.com/package/dynamic-outlines
Both are ~1 KiB handcrafted html + css, excluding the web font. I like minimalism. Hope you like it too!
Great site, by the way. I've been looking for some personal site inspiration and you've got a great aggregation going on here.
http://www.bhaskarnair.me/
it's not that good not even near those given in the links but hey, it's my website and I'd love some suggestions!
It's a modified jekyll theme so the design is not originally mine.
Unfortunately I haven't updated it in a while, but I plan on doing that in a couple of weeks with recent projects.
Self-written with React for component reuse. Hosted on my Hetzner Dedicated, Dockerized and Reverse proxied with Traefik.
Code: https://github.com/Empty2k12/portfolio/
I like the little GG that flashes for a moment.
Here's some other ones that I've collected and found cool interesting.
https://haldean.org/
https://nikhil.io/
https://shkspr.mobi/blog/
I think I might win the prize for the laziest and least fancy site. I've never even bothered to give any info page of who I am...
And here's my blog page: https://blog.praveen.science/
http://v1.harishnarayanan.org
http://v2.harishnarayanan.org
http://v3.harishnarayanan.org
http://v4.harishnarayanan.org
http://v5.harishnarayanan.org
https://harishnarayanan.org
Also, I built few minimalist Jekyll themes.
https://rproietto.xyz
http://kermittdavis.com
I try. Dynamical systems engineer is difficult to describe with text.
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."
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/
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 :)
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.
> Curios how its done? We are using paper.js and gatsby.js. Some behind the scenes: http://volligohne.de/projekte/timobecker/. Check out the source code https://github.com/voellig-ohne/timobecker
Sources for drawings: 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 :)
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.
https://ethanmye.rs
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
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?
Edit: lol even one of the other repliers is called ‘pixelbash’
> 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
Set aside a few hours a night, and before getting into Vue.js, CSS, etc., jot down a list of pages, sketch out a layout, and gather inspiration for the visual style and any creative ideas you want to add.
Really - find what elements attract you and reshape them. I think the more pages you look at, the more your brain will get stirred up about it.
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
This approach gives a lot better flexibility than Github's standard Jekyll.
Any other opinions?
> 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.
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.
I am not a stick in the mud. :) I just work in a different part of the field, and finding work has never been an issue. So do many others, and they're fine, too. I wouldn't worry about it.
Just realized I need to update my bio to now say I'm working at Google instead of Microsoft
PS: In case if one wonders what I mean, check this Googe Analytics heatmap for my home page: https://imgur.com/a/swtufo9
You could reduce that list by three by showing another list with icons instead of the name (GitHub, LinkedIn, email).
http://dogself.com
2. Draw the rest of the f* owl
Truth be told that makes this much more impressive...