Share your portfolio if you want feedback! (CLOSED)

So I decided to take a bit of a break from coding this afternoon, to relax my mind and create a discussion, where you could share your portfolios and I could give some feedback on what I like and some ideas to improve it.

Keep in mind that these would all be subjective, and coming from an average user. Sorry in advance if I don't reply to someone.

Share your link below, excited to see what you have come up with!

Comments

[Pablo Herrero]

pabloherrero.me/

:)

[Madza]

What I liked:

• The speed of the site.
• How clean the site is. Dark grey and white have always worked well when it comes to contrast. Your image fits right into the hero area.
• Animations on load and the ones that show your interests after it has loaded, to make it look interactive.
• Social links are well placed and with great contrast and I like how they are stuck regardless of a scroll position.
• Modals to view project, great to get details fast.

Some ideas I would consider:

• Set the background color to white for your header and increase the z-index so the header is always at the top when on screens around 1000px and scrolling. The same goes for the footer.
• Set darker top navigation text color, to match the color of your main text in the hero area. I would also bold them, and probably change the font style. I would do the same for the footer text as well in the bottom left.
• When using media breaks for projects, go from 3-2-1 rather than 3-1 as it is now, somewhere around 580px width, the text on them does not fit.
• I would build the custom contact form with name, email, message, rather than using 3rd party solution with multiple steps. That way it would be more intuitive, fill up the field you have left for contacts better and users would be more willing to fill it.
• Also when resizing, you put social media icons and copyright above each other. I would leave them the same size as they are on the desktop version and put proper padding for them, so it goes well with your overall layout of the site.

[Pablo Herrero]

Thank you very much for the feedback, Mazda! As soon as I have time I will put your advices into practice :)

[Madza]

Awesome to hear, hope you find something useful 👍😉

[Lucifer Chase]

Loved your site 🥳
Just a small thing, when hovering over a link, even though it changes colour, it sometimes feels weird and not sure if it is even a link or not.
So maybe adding an underline or changing the mouse cursor or something like that?

[E.R. Nurwijayadi]

Very cool...

Inspiring.

[Charanjit Chana]

Always open to feedback, so thanks in advance! Mine can be found here: charanj.it

[Madza]

What I liked:

• Loads almost instantly.
• Resume type of portfolio. Pretty unique.
• Your image and position to introduce yourself.
• The font looks clean.
• Good for responsive screens.

Some ideas I would consider:

• The dark brown background is not the best you can get for contrast for the white font. I would try some darker shades.
• Set the section titles (Experience, Subscribe, and The latest) the same size as your name is at the top. They each start new sections and therefore need to be more highlighted.
• Try to give some different colors for links you use, rather than white, to give more accents to your site. Do the same for the subscribe button, as well. Set them all to the Red you use. Or step outside and use some bright green or blue.
• I would remove the background color you use for 1 Thing A Week panel. If you, by all means, want to keep it, set it to a way darker color, so it goes well together with the background, and use it on the Experience and Subscribe blocks too. Leave both Intro paragraphs and 'More from' as they are.
• The emojis you use would look better if you would use them in native colors. They would look especially good on the darker color background as I noted in #1.

[Charanjit Chana]

Thank you for the feedback, I have one question though, is your device set to show dark mode? I wonder if any of the feedback around colours changes when viewed in light mode instead?

Some good points you raise I will definitely look at making some changes based on your feedback. Thank you for taking the time to review my site!

[Madza]

I guess you are using something like this since you ask. Yup, my OS is currently on dark mode. 🌙

You are welcome, hopefully, you find great use of something 😉

[Charanjit Chana]

There’s no toggle, it just uses your system preference to decide. Your feedback made me think about it differently though... I should look at it in dark mode more often!

[Madza]

Yeah I know 😉 That particular hook uses your system preference to decide as well, that's why I referenced it 😉 I see, you are mostly on light mode and see light mode in your portfolio as well 😀

[E.R. Nurwijayadi]

Lovely.

[goyal-aman]

amangoyal.ml

[Madza]

Overall I like the site, looks very clean and gives great UX.

• Remove that animation in the Hero area. If you want to display your roles, display them as static text in the same dark grey.
• Remove the social media buttons from the sidebar. You already use them in the Hero area.
• Avoid the skills percentages. It's not possible to measure them anyways.
• The blue used in the Timeline should be the same as in the other sections.
• There is a typo on the resume title.

[goyal-aman]

Glad you liked it. Have been working on it for weeks. My main goal for designing my own portfolio is to show of my backend skills by making it versatile.. my idea is If I wanna add any new section instead of going through html .. I will add a new section from admin panel ( yups there is an admin panel ).. kind of similar thing CMS.

And, I appreciate suggestion you have given will implement them. Also, What should I replace skill percentages with? Stars? Or maybe score out of 10..?

[Madza]

The thing I suggested to avoid the percentages is you will be asked in the interviews how did you measure them and why it is 65%, not 73%, for example. Also, I've seen some devs rating some of their skills as 100%, which means they know everything in that tech, which is impossible.

Stars are not great for that either. You don't have to rate your knowledge. That's the interviewer's part.
Simply listing them is enough for the most part.

[goyal-aman]

Great!! Thanks for suggestions ❤️

[Madza]

And if you still want some visuals for the skills, you can add the visual icons of the tech you know 😉

[goyal-aman]

Exactly what I was thinking to do..!! 😁

[Madza]

Awesome! Best of luck 👍😉

[E.R. Nurwijayadi]

This is not a portfolio site. Just a blog. Not as good as most people here. But I share it anyway.

🕷 epsi-rns.github.io/

After all. Thank you all for giving such comment. Now I know that I need to enhance the looks of my blog.

[Madza]

Good job on laying out the content. HTML side is already there. For CSS I would try to do a full re-design, use dribbble.com, behance.net, and Pinterest to inspire you.

[E.R. Nurwijayadi]

Thank youuuuu..

[Madza]

My pleasure 😉 Hopefully you will find some additional inspiration in those resources 😉🎨

[Jesus Enmanuel De La Cruz]

enmanueldelacruz.me/

[Madza]

What I liked:

• The white and blue used to split the screen.
• Nice hover effects in the navigation and portfolio items.
• Section title fonts and creative styling.
• Clean looking Projects and Contact pages.
• Great UX thanks to smooth transitions through white.

Some ideas I would consider:

• That grey shade on the HERO page does not fit with the white and blue you use. Set the text in the hero section to plain black (keep the name blue) and do the same for non-active icons at the right. It would look much more cleaner.
• Add some hover effects for the 'More' and 'Send Message' buttons as well. Like, change the color to a lighter/darker shade of blue.
• Set that dark grey you use to a plain black in the About Me section for Personal Information and Main Skills. That is crucial info, that needs to be highlighted.
• Each project would need some more description. Whether or hover or even better on the modal that pops up when you click on a particular project.
• Your mobile menu has a Blog section, which does not work. Check your console. Once you fix it include it in the desktop version as well.

[Jesus Enmanuel De La Cruz]

Thank you for you review, I will consider your ideas :D

[Madza]

You are welcome 😉
Hopefully, you find a use for something 😉

[E.R. Nurwijayadi]

Awesome. Really Cool.

[Jesus Enmanuel De La Cruz]

Thank you :D

[Conner Ow]

I made this one about two years ago and I will make myself another one later.
conner1115.github.io/

Some of the images got disabled for some reason but the links still work.
Also, the contact form is a fake and doesn't work.

[Madza]

Good enough for the start. I see you started with FreeCodeCamp, that's a great resource.
To get inspiration for styling try resources like behance.net, dribbble.com, and Pinterest.

[Madza]

I would redo it fully since you have most likely accumulated some new knowledge during those years 😉

[Tobias Nickel]

after reading a few other feedback, I also like to ask you to take a look at mine: Tobias Nickel

It is a static page made with hexo. I used a theme, but changed lots of stypes for lighthouse score and a11y with axe.

[Madza]

• I would put navigation in the same line profile info.
• Add some rounder border to the Search bar.
• Add some colorful patterns for the Github card instead of black.
• Add different background colors for tags.
• Add different colors for links and Read more buttons.
• Reduce the line height for titles.
• Re-design the pagination.
• Make the font color of your name white in the Footer.

[Rishab Kumar]

site.rishab.cloud/

[Madza]

Very clean looking.
The content is well-positioned.
Awesome contrast and easy to read.

• Add some animations for load more (Something similar you use on the Contact button)
• Use some bright colors to underline the tags. Current pale yellow does not work on white background.
• Consider hosting the blog content on your own site, to own it fully. That will also enable you to customize the UI you want. Currently, Hashnode design is different than what you use in your site.
• Make sure you use higher quality images (than HackerNews Clone, for example)

[Rishab Kumar]

Thanks for the feedback! 💜

[Madza]

Awesome you found it useful 😉

[Dewald Els]

dewaldels.com

WIP

[Madza]

The site can't be reached 😒

[Dewald Els]

Shit sorry! My phone auto corrected with my middle initial 😅

[Dewald Els]

Thanks for taking time out of your day to check this! Was in a hurry when I posted yesterday ✌️

[Nimish Dadlani]

Hello. Could you please review my portfolio as well ?
nmd2611.netlify.app

Thank you :)

[Madza]

I liked it, clean and nice animations.
Content loads too slow if I scroll fast.

[Nimish Dadlani]

Thanks !!
Will make the necessary changes.

[Madza]

Happy to help 😉👍

[Abdulsalam Ibrahim]

abdulsalamibrahim.tech/

Thanks!

[Madza]

• Change the color of navigation items to black.
• Position experience items on 2 column layout to fill up space.
• Use all the available horizontal space for positioning the skills items as well.
• Use a black border for your cards to accent them more. The current white one does not work on a grey background.

[Abdulsalam Ibrahim]

Thanks a ton on your feedback! Vscode here i come!! :)

[Madza]

Glad to help 👍😉

[Maulik]

Hi @madza , you have thoroughly analyzed the portfolios of people and given a quality feedback. My friend @shunjid created his portfolio and asked me to review it and I loved it. But can you please check it once and give the feedback?
shunjid.github.io/

[Georgey]

We'll I just made this one for a hackathon recently and it's been like a one year since I learnt web development the only thing I'm disappointed is the responsiveness rest do tell me what you like!
georgey-r9zrh.ondigitalocean.app/

[Thomas Ledoux]

thomasledoux.be => there is also a dark mode available (based on your browser preferences). NextJS + Tailwild used!

[Madza]

Profile image fits well and awesome feel of the site.

• Increase the size of the logo, so it's not the same as the navigation items on the right.
• Set purple underline for nav items depending on the scroll position (not just on hover).
• Increase the font size for those letter animations. They are on the landing page for a reason, after all.
• Use rounded borders for all content boxes if you use them on cards.

[Thomas Ledoux]

Great feedback! I’ll look into implementing this asap!

[Madza]

Awesome to hear! 👍😉

[Fum]

It's more of a blog/community than a portfolio but would appreciate your feedback:
inspirezone.tech/

[Madza]

I like how clean it looks and the use of animations.

• Re-design Join our community section (use all the space, it's too squeezed)
• Decrease the Footer section height and position items horizontally.

[Fum]

I'll keep this in mind at the next redesign. Thanks so much for the feedback!

[Madza]

Glad to help! 😉👍