Updated Portfolio

Portfolio - https://jdeliaportfolio.netlify.com/

A couple of months ago, I made a post asking for feedback on my portfolio/projects; I recently updated it, and wanted some feedback.

If you were an employer, what would be my chances of being hired (and what are the biggest red flags that I need to fix).

Thanks for the feedback!

It looks nice.

I think itā€™s better to use words as well as icons to describe your skills. It might be a recruiter looking at your portfolio who doesnā€™t know much about code and who doesnā€™t recognise the icons.

And maybe you should replace ā€œinterested in solving codeā€ with ā€œlove to use code to solve problemsā€ or something of that kind. Itā€™s stronger and it shows more passion.

Good luck with the job-hunting!

1 Like

Makes sense.

Youā€™re right about the ā€˜interestedā€™ partā€¦ thank you.

1 Like

No, or at least, not as more than an intern. I remember your portfolio, and Iā€™m not seeing a grand redesign. But more than that, Iā€™m looking at what you produced and asking, ā€œwould I get my moneyā€™s worth out of his work?ā€ Hereā€™s my reasons I would not think so:

  • The color scheme needs to be better. You need something visually eye-catching on your portfolio to get hired for HTML/CSS, since you have NO JAVASCRIPT AT ALL ON your portfolio - not a crime, but all ā€œunder the foldā€ and all requiring clickthrough. Youā€™ve given no consideration to contrast, let alone color theory. What about visually-impaired viewers? Lots of people with poor eyesight use computers.

  • on hover, the ring around your ā€œcartoon headshotā€ causes everything else to readjust layout. Bad. Couldnā€™t you have wrapped that in a div to contain the effects?

  • your github is full of sporadic (non-daily/near-daily) commits whose message is usually ā€œupdate.ā€ That tells me that your commit message would be useless on the team, and a poor indicator of how youā€™d communicate on a team.

  • Knowing your prior projects, I looked at ABDN. The main article is ā€œAnchors Away!ā€ with an ā€œInvalid Dateā€ error prominently displayed. This is what you put out to sell yourself. If not even for yourself, how could I trust you to put your best foot forward for my clients? (Also, an aside: Your blog is full of grandiose prose that youā€™ve attributed to yourself. This makes the error even worse - you thought a lot about the (blog?) content, and didnā€™t think about the code, or QA. I see the same text under different headlines. If you didnā€™t write this, just use Lorem Ipsum. Itā€™s there for a reason.) The navbar is not responsive correctly - it responds to horizontal resizes, but puts elements off-screen.

  • AGAIN: task crusher has no default login/demo account. I was able to make an account with fake info, but without explicitly telling people this was a project to practice authentication, no one will (I only did because I remembered). BTW - neither enter nor Ctrl+Enter activate the ā€œCreateā€ Button in the ā€œcreate taskā€ view despite it being colored as a default button. UX fail.

  • Save for Later: Okay, more interesting visually. Flat design, high contrast. Relevant ā€œaboutā€ section with link to portfolio, but no github repository, so I canā€™t see the code for the one that looks best. The upload button is active when no file is selected, but styled ā€œdisabledā€ after a failed upload? Shouldnā€™t it be the other way? Also, why the heck do I have to take a picture of a tweet to upload it? Isnā€™t that just an image dropbox app, then? Wouldnā€™t searching tweets require some text awareness? You do say itā€™s an experiment, but without talking about your projects, what you learned, and your design decisions in the portfolio, all youā€™ve done is left me scratching my head.

  • the portfolio falls down flat on UX. I clicked the thumbnails twice, think I must have initiated a drag by accident, but no, it just wasnā€™t a link, despite enlarging on hover. Of the 3 possible candidates, the only link is the lowest on the panel (not the big picture, nor the first line with the project name either).

I know Iā€™m coming off as harsh, but itā€™s because itā€™s what I would want to know. I see your code, and itā€™s not terrible (albeit completely sans documentation/commenting). You sometimes have a good eye for design. If itā€™s improving, Iā€™d have no way of knowing, since your portfolio doesnā€™t provide any chronology. Your github is littered with more projects, so are these the best? Iā€™d rather see 3 projects, well-polished: good UI, good UX, and motivated by a personal need - solving some pain point. Iā€™d also like to see you use the skills youā€™re showing off in your projects on your actual portfolio. It doesnā€™t matter what your store sells if the storefront isnā€™t inviting. How do I contact you? Through github? Not likely. Twitter? Great - but that is a dead link. Email? Totally acceptable. But itā€™s the third link on the right. Whereā€™s the big juicy high-contrast button saying ā€œContact Jesseā€, located above the fold just begging to be pressed? Whereā€™s the animation or parallax, or CSS virtuosity? Heck, whereā€™s the javascript/React on your portfolio? Your projects show that you theoretically have the skills, but you seem unwilling to put them into action to sell yourself.

3 Likes

First, thanks for the detailed and thought out response!

  1. My Idea for the portfolio is for it to be really simple. Iā€™d like more feedback from others on whether or not employers are judging portfolio complexity. I could implement those features, but it would feel out of place to put a bunch of random animations and distracting effects.

    Are you judging my ā€˜hire-abilityā€™ based simply on my portfolio complexity, or projects? It seems like something ancillary for employers (from my experience), but Iā€™m open for correction.

  2. Thanks for the onhover bug, Iā€™ll have fix it.

  3. Youā€™re right about the ā€˜Updateā€™ messages. Truthfully, I usually just use ā€˜Updateā€™ if its something simple like delete a word from text or some very basic and negligible change. I usually write more specific messages for more specific cases. I always feel bad when I do it, lol. Iā€™ll have to stop doing that.

  4. Could you point me to the invalid date error, Iā€™m not seeing it on my end (Screen capture). And the prose youā€™re reading is Lorem Ipsum, its been translated to english. I should maybe change that, since its a source of confusion. The navbar responsiveness is a bug thatā€™s been bothering me, I do need fix it. It sometimes occurs, and other times doesnā€™t.

  5. The TaskCrusher project, does need a redesign, I keep putting it off; I will need to do something about it.

  6. SaveForLater is on private, but I can provide code samples. I am still messing around with it, and I donā€™t want to mistakenly expose certain things. Thatā€™s why thereā€™s no repo.

    Good catch, on the button disabled until file is selected, I hadnā€™t considered that setup. You provide great suggestions to make it less error prone.

  7. The thumbnails werenā€™t meant to be clickable, I might change that, but refer to point #1. I do need to comment my code more, even if its a solo project. Those projects are for the most part in chronological order, and they are what I felt were most ā€˜eye-catchingā€™, not necessarily the most complex.

    Iā€™ve seen some great developers, with very basic and simple portfolios, so Iā€™m curious how seriously an employer would judge someoneā€™s portfolio because it wasnā€™t a kitchen sink of tech.

Again, I always appreciate your feedback, even though its sometimes hard to accept (intern??!!!, haha).

Thanks!

1 Like
  1. Simple != Clean. A clean design is fine. Animations were just what popped out of my head. OnHover type of animations are fine, but they canā€™t just be UI for the sake of UI. All UI must be in service of UX. If your panels enlarge on hover, they had better be clickable. Iā€™m judging whether I would hire you based on decisions you made. No documentation ( i donā€™t mean: i++; //increment the index, I mean jsdoc-style or equivalent: `this are the inputs and outputs to this function, how it behaves on edge cases, what will cause error, a summary of important details about implementation and my decisions therein. If there is some complex logic, or itā€™s the first time Iā€™m figuring something out that was complex for me, I write more, sometimes keeping the pseudocode (with modifications) as ā€œsubheadingā€ for chunks of code, along with empty lines to help readability.

  2. No problem.

  3. This ties in with the hireability. Just like I donā€™t want the ā€œincrement indexā€ coder, I donā€™t want: p=q+(v? x: z) guy either. (No ternary hate, I love it - I mean that variable names are part of documentation, as is a commit message. Iā€™m not perfect on this by any stretch. I tend to commit when I need to transfer machines, or after I wake up from a code fugue and have banged out 3 things on the TODO list. But I always try to make my commits reflect that.

  4. :laughing: I read some Cicero in school, but not that. ā€œLoremā€ isnā€™t a word I knew, so I shut off that part of my brain. Based on your translation, thereā€™s more than the words routinely used. I found out it was cut in the middle of a word ā€œdo/loremā€, and with the whole sentence, it makes sense. Thanks for the learning opportunity. But with that said, perhaps change it back to Latin, or change the author to Cicero. For your navbar, Iā€™m on Firefox/Win10, and have tried it on 4k and <1080p screens. No dice.
    Capture

  5. The taskcrusher is emblematic of the communication/not-selling-yourself problem that I see. It could be mostly fine (by changing the ā€œdefault buttonā€ issue) as-is. But without explanation, which I had to ask for last time, itā€™s useless to show off anything. Again: What did you use, what did you learn, why did you decide big decisions the way you did. I would rather see half as many projects well-explained.

  6. I get the private, I get putting it on the portfolio. I canā€™t understand doing both at the same time.

  7. As for code, if a tech person is hiring you, theyā€™re going to look. And what Iā€™d look for is: does this person do work that others can use and maintain? If I donā€™t see any comments, itā€™s a quick no for me. Not because they didnā€™t comment, but because they didnā€™t bother to comment what they presented to the world. As for the great developers, their resumes probably did the talking for them. Iā€™m guessing that youā€™re looking for that first dev job. If so, and were I you, Iā€™d make sure that it was super-easy to get people to see the things I wanted them to see. That doesnā€™t mean bells and whistles, that means UX decisions that achieve that goal, and UI decisions that channel that UX. That tells me that if hired, I donā€™t have to teach you (everyoneā€™s a gamble on how easily educable they are), I can just point out when the first draft doesnā€™t execute the mission of the web page.

What is the mission of your portfolio page?

1 Like
  1. Iā€™ll have to fix the date, its a browser issue. Thanks for point that out, I was suspicious of it.

  2. Are you saying that I explain the project in the portfolio, or in the Repo README?

What is the mission of your portfolio page?

To present my skills.

You have three sentences. Not long ones. What do you tell someone about that project? I would put in the portfolio. The Readme is for technical and/or non-technical people telling them how to understand/use your project, license info. As you said, you want your portfolio to ā€œpresent your skills.ā€ Is coding the only skill? What about critical reasoning? The ability to learn? The ability to evaluate your own work and progress? Both technical and non-technical people want to know that. You canā€™t guarantee whether anyone will look at your portfolio page. You canā€™t guarantee what role/background that person will have. Itā€™s up to you to make your page work for you. I would argue that youā€™re only seeing part of the elephant. Your portfolio isnā€™t to present your skills, itā€™s ā€œto sell a potential employer on hiring Jesse Delia.ā€ Design that instrument. The one which guides people to the ā€œcall to actionā€ (Interested in hiring Jesse Delia ? <button>Contact Jesse Now</button>). Something that stands apart. The way I view a great portfolio is: itā€™s a landing page for getting you into the interview room - part of your sales funnel. Read this great article on Landing pages to understand what I mean by UI serving UX, and UX being oriented to accomplish the mission of that page. In this case, the page is both the vessel of that mission, and the message itself. Why is all your most important content ā€œbelow the foldā€?


Bring it to the people, donā€™t make them go hunt for it. All that negative space above the fold is bad design. If they arenā€™t on mobile, they want to see your projects right away. Maybe a very minimal animation that, after 750ms, moves your image over to the side and presents them a carousel of your projects with 2-3 short sentences on each? That both presents your projects and your web skills right away. Not a single user action was required beyond navigating to the page. Emblazon a big, highly-contrasting contact button under that pic of you on the side of the screen, or for mobile viewports, have it float at the bottom of the screen maybe.

1 Like

Iā€™m gonna implement some of your suggestions.

Will post them when finished.

Thanks!

1 Like

I made some updates.

I donā€™t feel like a description of the project, on the card would go with the aesthetic of the site.

What action would you like a user of your site to take? Design your aesthetics around that.

1 Like

I like it a lot. Simple is better than complex and confusing (and boring).

Also, the ā€œHire meā€ button itĀ“s so cool haha. I think I will copy you on that :rofl:

1 Like