Show HN: Built my resume as an interactive website, version-controlled on Github

https://github.com/philipithomas/cv-philipithomas

by philip1209 • 14 years ago

82 82 14 years ago

jfaucett2• 14 years ago

awesome job! Looks great, just forked :) Also I was looking at the upcoming features list, and I think definitely the pdf functionality would be cool (I'm thinking the fpdf lib - know a better one?). Another idea for a feature would be to give this an REST api for xml, json, and you can then just make an appropriate call to it ( /resume.json, /resume.xml, etc). Again nice!!

zrail2• 14 years ago

I set up my resume[1] with PDF exports using Docverter. It takes Markdown or HTML and turns it into PDFs and Word docs.

[1] http://www.bugsplat.info/resume.html

(Disclaimer: I also built Docverter)

jfaucett2• 14 years ago

this is a really well done project, did you build the whole app yourself?

EDIT: I guess you just answered this :) awesome job, it looks amazing!

philip120910• 14 years ago

Live website: http://cv.philipithomas.com

maccard3• 14 years ago

Fantastic looking. Forked, and going to deal it with myself tomorrow!

jmitcheson• 14 years ago

Nice work, it looks really good.

One minor (and I mean really minor) design thought: in the section near the bottom "Selected Projects", there are grey buttons and blue buttons; in the close proximity of the blue buttons, the grey buttons sort of look like they are inactive or disabled, at first. I put my mouse over them and figured out they were indeed active links, but maybe someone non-technical might not do that.

philip120910• 14 years ago

Good point - thanks!

Edit: Site updated - the buttons are now green.

maccard3• 14 years ago

Also, to anyone who forks this and decides to use, you might want to remove the authors original google analytics!

philip120910• 14 years ago

Good point - I just added that to the "Building Your Own" section of the Readme.

maccard3• 14 years ago

I'm not criticising, I'm only trying to complement what you've already done. The buttons show an underline on Safari on OSX when they're hovered over. I'm working on it now, and will post a link with my fixes later on. Fantastic work, thanks so much!

knodi• 14 years ago

Isn't this kind of an over kill, i mean how often does one update their resume.

flyinglizard• 14 years ago

Really cute, props on the originality. The general design is good (I loved the skills bars!), but your Experience sections looks a bit too wall-o-text. I can't imagine reading through all that.

If I were you I'd try reducing the word count as much as possible as well as applying a very very subtle background shade for each position to set them apart (or something similar to that).

Anyway, awesome stuff.

philip120910• 14 years ago

Thanks for the feedback. I want to have better info on the individual companies by somehow incorporating their logos - I'm considering a modal or a popover at the moment.

The subtle grey background is a good suggestion. I'll experiment with some things, and if you do anything cool on a fork, please put in a pull request!

jbranchaud• 14 years ago

I like mostly everything I see, but I have one criticism. The bars in the technical section seem arbitrary. It seems that a person viewing this CV wouldn't know quite what to take away from it. To start, I am assuming this is some sort of proficiency. The proficiency of a skill is relative only to the proficiency of the other skills which doesn't tell a person much. Is there some way that you can give the bar a baseline to work from. Something along the lines of 'no experience' -> 'comfortable' -> 'proficient'.

mkramlich• 14 years ago

I love those skill bars.

Because they say something meaningful, potentially, namely what you're relatively better or worse at, more or less experienced at. Without committing the sin of telling the world what your objectively absolute rating is in some supposedly global but in actuality undefined frame of reference.

Example: "I'm a 6/10 on Apples and an 8 on Oranges, and Bob over there says he's 9 on Apples and 1 on bananas. Turns out in actuality I'm way better at Apples than Bob, but Bob kicks most people's asses at bananas!"

miles_matthias• 14 years ago

I totally agree. That was the main original thing I saw and I'll be looking through the code to see how those are generated or if they're just static.

FuzzyDunlop2• 14 years ago

They're static:

https://github.com/philipithomas/cv-philipithomas/blob/maste...

FuzzyDunlop2• 14 years ago

I disagree, because they're completely arbitrary and a full bar can suggest that you either know everything, or you can't improve any more.

Trying to represent knowledge or skill on a finite scale is a bad idea, I think. If I got this CV in a pile I'd want to see examples to demonstrate that skill in place of this section, not a set of percentages pulled from thin air.

S4M• 14 years ago

Agree. The OP should mention what he has done or what he knows with the technologies and languages he is assessing himself.

For example:

Matlab: built a model to do X in matlab, used very frequenty to do my reports for two years.

sainttex• 14 years ago

I hope this catches on as a trend. A similar setup has worked great for me for some time now. Don't forget your print media specific styles though...

TannerLD• 14 years ago

Cool idea. This is something I've wanted to do for a while. I'll have to fork this later for my own use.

Few things I noticed that could be improved. Your technical section isn't very clear on what the graphs mean. Do the bars mean the amount of time you've used that technology, the number of projects you've built with that technology, or your experience? It's creative, but it's hard for me to understand what they mean (especially relative to one another).

I also noticed that you didn't include a print CSS. Yeah, physical resumes are not great, but they won't go away for a while. It would be good to have a print CSS that replicates generally what print resumes looks like. Right now it doesn't look very good. It wouldn't be hard to fix.

On another design note, I think it would look better if the pill links didn't have a blue underline on hover.

Timothee• 14 years ago

I'm sorry but I don't get it. What's interactive about it?

It looks like a fairly regular resume to me except for the fact that it's rendered as HTML, but that's not really something new. Sure, it's actually built dynamically with a few PHP functions, but the way each element is built could be smarter (e.g. you have HTML markup in the function's arguments sometimes which seems to beat the purpose a bit).

I'm not trying to be a downer but I was expecting something different and I feel I'm missing something.

If I were to do something like that, I would probably do it in Markdown with Jekyll. Right now, your index.php mixes a lot of presentation with content and I feel that one benefit of Markdown+Jekyll is that you have a readable Markdown file that can be made into a nice looking static HTML page.

dylanhassinger• 14 years ago

This is awesome!

danso• 14 years ago

This is a nice start but you're missing a huge opportunity to show off your sites in a visual way. Why do you think outbound links are the best way to represent your work?

philip120910• 14 years ago

I'm planning on tweaking with modals that show logos and descriptions of specific projects and companies. The other option is having logos appear on over of the names.

I really wanted content to be king, so I didn't include the immediate clutter of a bunch of logos and galleries. The modals make it more interactive.

v33ra2• 14 years ago

Good one.

Sometime back, I designed my resume on similar lines. I used hResume microformats and some CSS goodies too.

Here's the live resume: http://veerasundar.com/resume/ and a blog post explaining the design: http://veerasundar.com/blog/2012/06/redesigning-my-resume-wi...

Surio12• 14 years ago

Looks nice! I liked it.

One (minor?) feedback:

Opinion on whether "Ninja" is awesome or uncool is divided even within HN. See recent discussions on "Product is a byproduct" thread. Now, I am trying to imagine how it might be perceived in conservative working environments like Indian workplaces.

IMO, keep the wording and ditch the Ninjas. Ultimately, "what matters in life is how you see yourself"[1]

There must be a way to highlight which are your best skills, like this OP's resume progressbars?

[1] http://blog.robinleehatcher.com/.a/6a00d8341cb0ee53ef0148c75...

v33ra2• 14 years ago

//There must be a way to highlight which are your best skills, like this OP's resume progressbars?//

In fact, I do have one similar to progress bars. Have a look at the skills section in home page (http://veerasundar.com) where I show a strength bar for each skill.

When I ported the skills section, I just decided not to include the progress bar.. may be I should add it there too.

noinput• 14 years ago

Congrats on making Eagle. There are so few of us out there. </left_handed_shake>

philip120910• 14 years ago

Thank you! Justifiable contentiousness of the parent organization aside, I am proud of the achievement. In terms of a resume, the Eagle award is unique as the one part of pre-college life that will stay on the resume forever.

phektus• 14 years ago

I have my resume like this but I also made sure it is easy for others to make their own at my site's expense: http://www.cvstash.com

Surio12• 14 years ago

+1 for taking the effort to build something to scale. :-)

Hmmm... I checked it.. Good landing page, but your "Sample Resume Preview" which is supposed to load this: http://www.cvstash.com/profile/john_doe_EUQ8q3gDV

instead redirects to this: http://www.cvstash.com/resume/default/index//

I would like to see the preview of a Resume, before wanting to actually go ahead and try it, no?

EDITED to add: Even clicking on your name: http://www.cvstash.com/profile/arbie_samong_mfvvK163U leads me to the front page. Looks like I have to sign up before the site decides to show me anything.

EDIT 2:::

I bit the bullet and clicked JOIN NOW, and got this message:

Internal error

Ticket issued: unrecoverable

Man, I am so sorry to be the bearer of one bad news after another......

I'll give it a few hours before checking back. :-)

realguess• 14 years ago

The part I like is version-controlled on GitHub. Now if I can just 'git log' my employment history ...

alexholehouse• 14 years ago

Great to see a fellow Wash U student on here - nice work. One thing - is there any way to export it as a pdf?

I know this kind of defeats the purpose, but some people/companies may still want to print these things out, or at least have them on file where they have a static copy (as in it won't change automatically), so having control over what that pdf looks like might be useful.

Just a minor point though, love the design.

creativeembassy3• 14 years ago

You raise a good point. If I attempt to print it, Chrome has a terrible time rendering it for print; it's completely unreadable. I think that may just be the custom fonts used. OP should figure that out with a print stylesheet.

raganwald• 14 years ago

First off, I am fifty years old, so I'm fond of traditional phrases like Curriculum Vitae. That being said... I suspect many people may find it a bit stuffy. Also, I don't think that you can have it both ways: If you use old-fashioned words, you should present it on high-quality paper, lovingly typeset. It strikes me as a little out of place on an interactive web site. JM2C, I'm not sure how you could meaningfully A/B test it.

Second, if you are seeking a programming job, a program is obviously a portfolio piece. Am I correct in assuming that were I to hire you for a project, your preferred approach would be to mix HTML with PHP code that in turn embedded HTML in strings?

If that's what you want to suggest, this is the right approach. If you want to present different options, I would put them to work in your résumé even if they might be a little overkill for your needs.

snowwrestler• 14 years ago

In the U.S. "curriculum vitae" has a specific meaning, which is to convey the research interests, history, and publications of an academic researcher. They are typically several pages long.

This is not a curriculum vitae, and should be called a resume. Particularly since the guy is still in academia where they tend to take their bureaucratic nomenclature very seriously.

aviraldg• 14 years ago

In the rest of the world, curriculum vitae is almost synonymous with résumé and is used more often to convey the same meaning.

k-mcgrady• 14 years ago

I wouldn't say Curriculum Vitae is an old fashioned phrase. In Ireland and the UK I never hear anyone refer to a resumé, they talk about their CV or Curriculum Vitae. I think it depends where you come from.

latchkey• 14 years ago

Props for using CloudFlare.

Negative for the JavaScript error on the page. You need to load jquery before you load bootstrap.

philip120910• 14 years ago

Whoops, corrected. Thanks.

Also, I'm a huge Cloudflare proponent.

asparagui2• 14 years ago

Cool to see somebody else who was @ startup weekend CoMo. I thought your idea was one of the better ones in terms of actually having a revenue plan. Are you still pursing it?

philip120910• 14 years ago

Thanks! Which team did you compete with? The project is on the backburner at the moment as I'm wrapping up midterms and interviewing for a job. One of the GPs in my VC firm put me in contact with some great tools for getting better margins, so we have the resources to continue pursuing it. It is just not a priority at the moment.

Also, did you see the article I wrote for the business journal about the event? http://www.bizjournals.com/stlouis/blog/BizNext/2012/10/comm...

asparagui2• 14 years ago

Cool article! I wrote some Javascript/iOS code for the FundRunners project. We only had six people, ;-)

JCordeiro• 14 years ago

I like the way you outlined your skill levels using progress bars. I've always found it tough to describe how good you are with a certain programming language. Saying "proficient with Java, PHP, etc... doesn't really attest well to your skills.

nardsurfer• 14 years ago

Great idea! I'm also working on an interactive resume, but havent finished or pushed the code to github yet. http://www.stevewight.com/resume

creativeembassy3• 14 years ago

If we're doing feedback on version-controlled-via-Github "interactive" resumes, my I present mine?

http://judy.github.com/

- It parses via the hResume microformat, although I've never been able to fully test that. Is there a way to do that now?

- It prints quite nicely; there are hidden sections that allow me to move the contact information up top when you're printing it, more like a traditional resume.

- It's responsive. It should look good on any phone, tablet, or traditional display.

Please, please fork it if you like it. You have my full permission. (I mean, just don't copy the content, mmmkay?)

creativeembassy3• 14 years ago

Actually, I'm going to reply myself as I'm looking at it again. I built this when Bootstrap was hot shit; it's now a bit cliche-looking, so to speak. I may play with the styles.

I've also gone back and forth on having a picture or not. That pic is on every other "resume" site out there, like Dice or StackOverflow Careers or LinkedIn.

I'm also not looking for a job currently, but I AM looking to speak at more events, now that I'm doing open source work for a living. I wonder how the structure should change?

Surio12• 14 years ago

>> I've also gone back and forth on having a picture or not.

It gave me a first impression of you, one that was more affable/likable (a better picture of you, that your skills or GPA cannot give). So, in my view, leave it there.

>> but I AM looking to speak at more events, now that I'm doing open source work for a living.

Why don't you search for interesting tech gatherings in and around your areas and offer yourself as a lineup speaker? One example:

http://www.meetup.com/find/?keywords=hacker+news+&userFr...

Surio12• 14 years ago

I ended liked your presentation aesthetics better than v33ra's resume below, even though both of you seem to be using hResume.

Props for the manner of execution. IMO, it looks relevant, pleasing and marketable. Don't worry too much about how it looks. Yes, there's always going to be some "Haters gonna hate", but I doubt it would be for your CV.

InfinityX0• 14 years ago

I've read/heard that it's best to flip your experience with education unless you want to be viewed as someone entry-level. When education is the best thing you've done, sure, list that first. But when you've created things like an actual business, you want to highlight that first and foremost.

Like the inefficiencies of a call to action being hid at the bottom of a page, you want to highlight your best value proposition (most likely to be the most recent thing you've done) closest to the top.

adambom• 14 years ago

bootstrap

holgersindbaek• 14 years ago

Your website - http://philipithomas.com - has exactly the same design as the - https://svbtle.com - network.

Are you part of that network (if so... how did you do it?) or are you just really copying on a grand scale?

TallboyOne• 14 years ago

It looks fairly average to me.. but it is great your getting exposure. I hope something good comes of it.

debaserab2• 14 years ago

If you are really that far along with your PHP skills, I don't think presenting an index.php as embedded HTML with a few string assisting PHP functions grants a lot of confidence to a knowledgeable employer about your skillset.

philip120910• 14 years ago

I honestly started with an index.php because that's the easiest way to serve a static site on heroku. I just intended to put up a static site, then built a couple functions for efficiency in formatting. It wasn't intended to be a demonstration of my programming ability; it was designed to be something quick thrown up in a day.

kami8845• 14 years ago

>It wasn't intended to be a demonstration of my programming ability; it was designed to be something quick thrown up in a day.

Well yeah then that's EXACTLY the impression you're gonna give off. This is the first thing a potential employer will see if you're already giving off a "I don't really care about the code" vibe I don't see how that inspires a lot of confidence in your abilities and especially mindset down the line.

MojoJolo• 14 years ago

I don't get it why you said it's interactive. But I like the simplicity of the design. I also built mine, but not in Github, well here http://jpbalb.in/resume.html

Just a thought though, is self picture important in the resume?

Surio12• 14 years ago

>> is self picture important in the resume?

Especially if you're the greatest and the one and only.... Mojo.....Jolo ;-)

OK, seriously though, there is no hard and fast rule on this one.

But in all, it is not a bad idea to keep a portrait with one's CV. There are very good reasons why it will be taken well, rather than why it won't be taken well. If you already have it there, just leave it there. Remember to update it periodically though. That is very important.

olalonde• 14 years ago

You founded two startups, you are an analyst for a VC fund, yet you are still "looking for employment after graduation"? Only on HN...

wj99• 14 years ago

And FFS everybody please, please. quit calling your website a "startup".

Surio12• 14 years ago

Like a few others, I too found it an average CV (It is something very similar to what I myself have, and I consider myself an average (-; ). To be honest, there are a few others in the comments that I gravitated towards more (It's a matter of personal preference of course). Sure, the Progress bar looks new, but others too have it on them -- see v33ra's response below.

You took a chance and placed it on HN for the self-promotion/ exposure/publicity and you were (luckily) rewarded. As you can see from the comments below, there are a lot of such efforts out there and all of them very commendable as well. They just didn't feel promotional enough like you, to place it here in the first place (and all of them had also placed it on GitHub before you, so open sourcing is not an USP either).

But I felt there there was neither anything "stand-out" about the CV, nor was there anything "interactive". It is a web resume like everyone else's and that's it.

For inspiration, here's what I would consider an impressive (as in look-and-feel) web CV and something close to an "interactive" web CV: http://www.chrisharrison.net/

My two bits.

hluska• 14 years ago

Sorry to be 'that guy', but are you sure you attached the correct link? Chris Harrison's CV is (sadly) in pdf on his website!

Surio12• 14 years ago

Hey! No worries. ;-)

Remember, we are speaking interactive+web+CV in this thread. So, basically, the entire website is his CV (Research, Visualizations, Fun, Travel -- Top right corner).... You interact with the site and you learn about all his skills (in a very fun, very tangible and informed manner). Also, the teaser animated gif that showcases a few of the "cool" things he's working on, are an excellent teaser/appetiser, don't you think?

Anyway, I suggest you keep a few hours free and sit down with your favourite bevvy and then start clicking..... That's how it's for me with his site every time ;-)

EDIT: If you liked the design and presentation of that CV, please upvote the original comment so the site gets some visibility that it deserves as an interactive and constantly evolving "skills" showcase. (He's no relative of mine, and I have nothing to do with him either personally or professionally)

calpaterson• 14 years ago

I'm confused about the date format. I'm British, and was expecting an American format (even though you confusingly call this a CV instead of a resume) but it looks like it's in British format. Perhaps you could remove the ambiguity by using "January 2012"?

ceras• 14 years ago

This is very long and there is a lot of white space (hard to skim). I honestly would not enjoy having to read this, and the lengthy anti-skim style comes off as somewhat arrogant to me.

Resumes are typically one page, so you should really consider either supplementing this with a one-page version or shortening it.

dutchbrit2• 14 years ago

Shameless plug, but I used a jQuery timeline plugin to create my CV, since I found regular CV's boring. It's not that detailed, but it's less dull in my eyes. Still need o add my LinkedIn profile that will serve as the boring version. Ps. Doesn't look great on mobile yet..

http://www.samgranger.com/cv/

I still need to change a lot and I might end up taking a completely other approach. But I want to make it as interactive as possible. Probably will end up writing my own plugin.

My old CV: http://www.samgranger.com/old_cv/

Surio12• 14 years ago

+2 (Figuratively, of course!)

Fantastic! Now, that's an interactive CV! Lovely!

Wishlist: I want to play with the code. Any plans to make it public? ;-)

NitPick: the action film image on the top makes the white coloured font unreadable, but the image itself is cool. :-)

P.S: My Web CV employs the same look and feel as yours does.

robeastham• 14 years ago

Another shameless plug. I'm slowly bootstrapping MightyCV - a resume platform with hacker leanings. It has integrations with HN, github and StackOverflow along with some other cool features.

http://robeastham.mightycv.com

If you like the look of it you can sign up for an invite at http://www.mightycv.com

Surio12• 14 years ago

+1 for building something like this to scale (rehashed from another reply below, but circumstances are the same) ;-)

Might test it later and let you know.

dutchbrit2• 14 years ago

Cool stuff, good job. I was actually planning something similar a while back but never got round to building it.

biscarch• 14 years ago

You inspired me to build out a personal website for my YC app.

Check it out here if you're interested: http://news.ycombinator.com/item?id=4676920

xyzzyb• 14 years ago

By interactive do you mean you made a webpage for your resume? That's been a good idea (for tech/programming jobs) for years now.

Shameless example, mine: http://stephenballnc.com/resume/

Surio12• 14 years ago

You had my admiration, with the Ubuntu theme ;-)

imjared• 14 years ago

1) If you're in the US like you say you are, this is a resume, not a CV. 2) The "website" link for Food Trucks Near Me does not work.

Also, I'm a bit baffled by these graphs. While they look nice, I'm not sure what they're conveying. Is there an endpoint for learning/competency (100%) like a bar graph would suggest? If anything, I think a pie chart might reflect your abilities better since it doesn't claim that a College Senior is 50% done/proficient/knows everything about Python or whatever (I don't claim that you're not awesome with Python but that's quite the bold claim, even for someone with many, many years of experience).

Otherwise, looks good and definitely beats a paper resume.

eamsen• 14 years ago

As a programmer, it never occurred to me that you would not keep your resume, be it online or on paper, under version control.

Your resume looks good, but I have some (personal) objections to it.

The bright background, most people seem used to it, but I don't like it; something more subtle (gray) could make the site look more smooth.

The free space, just because you can scroll, it does not mean that you should waste screen estate like that; e.g. on a 23" screen, almost half of the screen is occupied by your name.

The skill bars are a controversial topic. I am considering them for my resume, too, but to me setting the values seems rather arbitrary.

Section priorities, visually the skill bars take up a huge amount of space, yet the projects section (which is more important, because it's providing proof) looks like some background noise due to its size and different background color.

I think it's a good start and can become a great online resume!

It's always easier to judge other people's work, so you are free to punch back, you'll find my resume at http://me73.com (WIP).

PS: If I was in the position of deciding whether to hire you or not, I wouldn't; given your experience section, you already seem to be actively holding 7 positions, how could you have any time left for my business?

criveros• 14 years ago

in your about section, why do you talk about yourself in third person?

Show HN: Built my resume as an interactive website, version-controlled on Github

Related Stories