DEV Community

Share your portfolio if you want feedback! (CLOSED)

Madza on January 11, 2021

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 a...

Read full post

Pablo Herrero • Jan 11 '21

pabloherrero.me/

Madza • Jan 11 '21

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 • Jan 12 '21

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

Madza • Jan 12 '21

Awesome to hear, hope you find something useful 👍😉

E.R. Nurwijayadi • Jan 11 '21

Very cool...

Inspiring.

Lucifer Chase • Apr 7 '21

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?

Charanjit Chana • Jan 11 '21

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

Madza • Jan 11 '21 • Edited

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 • Jan 11 '21

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 • Jan 11 '21

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 • Jan 11 '21

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 • Jan 11 '21 • Edited

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 • Jan 11 '21

Lovely.

Jesus Enmanuel De La Cruz • Jan 11 '21

enmanueldelacruz.me/

Madza • Jan 11 '21 • Edited

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 • Jan 11 '21

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

Madza • Jan 11 '21 • Edited

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

E.R. Nurwijayadi • Jan 11 '21

Awesome. Really Cool.

Jesus Enmanuel De La Cruz • Jan 11 '21

Thank you :D

goyal-aman • Jan 12 '21

amangoyal.ml

Madza • Jan 12 '21

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 • Jan 12 '21

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 • Jan 12 '21

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 • Jan 12 '21

Great!! Thanks for suggestions ❤️

Madza • Jan 12 '21

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

goyal-aman • Jan 12 '21

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

Madza • Jan 12 '21

Awesome! Best of luck 👍😉

Conner Ow • Jan 12 '21

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 • Jan 12 '21

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

Madza • Jan 12 '21

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.

E.R. Nurwijayadi • Jan 11 '21 • Edited

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 • Jan 12 '21

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 • Jan 12 '21

Thank youuuuu..

Madza • Jan 12 '21

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

Dewald Els • Jan 12 '21 • Edited

dewaldels.com

WIP

Madza • Jan 12 '21

The site can't be reached 😒

Dewald Els • Jan 13 '21

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

Dewald Els • Jan 12 '21

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

Rishab Kumar • Jan 12 '21

site.rishab.cloud/

Madza • Jan 12 '21

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 • Jan 14 '21

Thanks for the feedback! 💜

Madza • Jan 14 '21

Awesome you found it useful 😉

Tobias Nickel • Jan 12 '21

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 • Jan 12 '21 • Edited

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.

Nimish Dadlani • Jan 12 '21

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

Thank you :)

Madza • Jan 12 '21

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

Nimish Dadlani • Jan 12 '21

Thanks !!
Will make the necessary changes.

Madza • Jan 12 '21

Happy to help 😉👍

Cesar Aguirre • Jan 11 '21

I'm working on my blog/portfolio: canro91.github.io All comments are welcome. Thanks

Madza • Jan 11 '21

What I liked:

The site is very quick.
Clean looking font for the Blog, About, and Project content.
Minimal feel and very easy for the eyes.
Code formatting theme goes well with the site color palette.
Overall the content (right side) looks great.

Some ideas I would consider:

I would suggest putting the content that's currently in the About section to Home.
Create a new section Blog (under the Home) and put there everything that is now in Home. And then remove the About section as it is left empty now.
The landing page should be the introduction. Both points above fix that.
I would suggest using all the vertical space in the sidebar, that way you could make more margin between items and they would not be so squeezed.
Change font for navigation, make the nav items bigger, highlight them. Currently, it is hard to notice there is navigation at all.
Center the social media buttons and put them under copyrights.
The date and the tags you use under the blog title need re-design. See how it looks without the tag icon. Consider removing it (since you don't use icons anywhere else) to continue the minimalistic approach.
Consider developing separate navigation for mobile screens, like the hamburger menu in the top left or right, that opens in the whole screen with the nav list.

Cesar Aguirre • Jan 12 '21

Thanks Madza for all your comments. Yes, I'm working on a landing page to replace the content of the Home page. I will put your comments into action. Thanks again. Happy coding!

Madza • Jan 12 '21

Awesome to hear! 😉👍

Fum • Jan 12 '21

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

Madza • Jan 12 '21

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 • Jan 12 '21

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

Madza • Jan 12 '21

Glad to help! 😉👍

Chris Bongers • Jan 11 '21

chrisbongers.com

Madza • Jan 11 '21

What I liked:

Easy to navigate.
Hitchhiker's guide to keeping track of progress is unique.
URLs with hashes to forward the user to a specific position.
Particle background to simulate the night sky.

Some ideas I would consider:

'Things I'm proud of' image content took me a while to load on the initial load. Once the images are catched everything is smooth.
In your overall layout of the site, I think the 'Things I'm proud of' items would look better if you would use title, description, and image pattern to display. Currently, it is hard to understand what each project is about without visiting the live link.
I miss some more interactive stuff, like zooming skill boxes on hover, changing color on navigation items on hover, etc.
Reduce the height of the header once the user starts scrolling, to increase the reading space and set it back to normal once the user is back to the top.
Also consider implementing a separate header for the mobile version of the site, to increase the reading space for small screens.
The way 'Don't take my word for it' currently swaps the recommendations could be improved. I would most likely create a new custom component for it, so the transitions are cleaner.
Maybe consider implementing the light mode switch for the site.

Chris Bongers • Jan 12 '21

Hey thanks!

Will definitely take these in consideration! ✌️

Madza • Jan 12 '21

No worries, hope you find something useful 😉

Benjamin Muskalla • Jan 11 '21

bmuskalla.github.io/

Madza • Jan 11 '21 • Edited

What I liked:

The fonts look awesome and very clean.
Your photo looks crisp and the oval formatting fits right in.
Clean social media icons. Great contrast due to black and white.
A nice accent of green here and there thorough the site.
List pattern is kept through the site. Simple and minimal, yet effective.
Great navigation bar functionality for mobile screens.

Some ideas I would consider:

Increase the font-weight for navigation a bit or change their color to a darker shade to match the theme of the hero area. Same for the footer.
Remove the extra padding or margin for Blog Archive items, so they keep the same layout pattern as Articles, opensource, and Talks.
Use the same font size for the Vitae as you use in previous sections. Currently, Vitae content looks a bit squeezed.
Maybe consider using some slight animations between the pages (like fading), so transitions would be smoother.

Benjamin Muskalla • Jan 11 '21

Thanks, Mazda, very appreciated. Lots of good suggestions, I'll include some of them.

Madza • Jan 11 '21

Awesome to hear, glad you found something useful 👍😉

Anthony DiPietrantonio • Jan 12 '21 • Edited

antdp.dev

Madza • Jan 12 '21

It's good enough to start with.

Add a profile picture or illustration on the top.
Add some interactivity for cards on hover.
Increase the font size of the section titles and bold them (currently project tiles are bigger than the section title)

Anthony DiPietrantonio • Jan 12 '21

Appreciate the feedback!

Madza • Jan 12 '21

Awesome you liked it 😉👍

Abdulsalam Ibrahim • Jan 12 '21

abdulsalamibrahim.tech/

Thanks!

Madza • Jan 12 '21

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 • Jan 13 '21

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

Madza • Jan 13 '21

Glad to help 👍😉

Georgey • Jan 13 '21

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/

Will Holmes • Jan 12 '21

willholmes.dev

Madza • Jan 12 '21

Make the hamburger icon plain black.
Use brighter blue how highlighter text.
Some image or illustration is missing in the Hero section.
Reduce the letter spacing of the Hero font.
Position socials horizontally.
Change the font of the Footer.
Center Footer content.
Add some more contact details.

Will Holmes • Jan 12 '21

Thank you!

Madza • Jan 12 '21

You are welcome 😉👍

Abiola Esther • Jan 12 '21 • Edited

abiolaesther.me

Madza • Jan 12 '21

Great white-purple color scheme.
Nice animations on Projects cards.

I would re-design the logo. Something much easier to read and use SVG for better quality.
Increase the font size of your name below the image.
Give a nice top margin for your description about you, so you use vertical space more.
Make section titles way bigger, they start a new section after all.
Remove that flipping animation from Skills.
Add images for your Writings list.
Create a custom component for Send a message, so it is more intuitive.

Abiola Esther • Jan 12 '21

Thanks 😊

Madza • Jan 12 '21

Awesome, happy to help 😉👍

Wiz Lee • Jan 11 '21

wizlee.dev
Thanks in advance! 🙌

Madza • Jan 11 '21

What I liked:

The color scheme used for the site and the random shapes look clean.
The UX when scrolling and using animations to display the content.
Clean and great looking About me section, image look great on that white background and well-formatted with that oval shape.
The cards are beautifully formatted with a nice hover effect.
Social media cards look clean on the white background.
Feels good on mobile devices.

Some ideas I would consider:

Change the profile pic in the top left to the logo of a text of your full name or initials. Would probably look good on plain white.
I'm not a fan of the font used on the landing page. Try some more rounded fonts, or if you stick with the one you have, decrease the letter spacing, and increase the size a bit.
Animations that change your skills on the landing page are overlapping your greeting text. Plus each time the different length of the text is switched, it affects the greeting position, which should be intact.
If I scroll fast, the writing cards load too slow. I'm at the bottom of the page, yet only the first row of cards is loaded. I expect the same would happen for Projects if there would be more cards.
Change the font for the footer to some more rounded fonts, as well (like already mentioned in #2)
Fix the 404 in the console and remove the console log output.

Wiz Lee • Jan 12 '21

Great stuff, appreciate the feedback! Will make improvements according =)

Madza • Jan 12 '21

No worries, hopefully, you find something useful 👍😉

Thomas Ledoux • Jan 12 '21

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

Madza • Jan 12 '21

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 • Jan 12 '21

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

Madza • Jan 12 '21

Awesome to hear! 👍😉

Chittoji Murali Sree Krishna • Jan 11 '21

chittojimuralisreekrishna.github.i...

Madza • Jan 12 '21

Good job on laying out the content. The 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

Chittoji Murali Sree Krishna • Jan 12 '21

Thaks bro, I will definitely look into it

Madza • Jan 12 '21

Awesome to hear! 😉Hopefully, you find something useful 👍😉

Thabo Pali • Jan 12 '21

thabopali.co.za

Madza • Jan 12 '21

Great animation across the site.

Put your image in About me to replace the placeholder.
Avoid the skills percentages, as you will be asked how did you measure them.
I would increase the font size for the descriptions, as some of the tiny text is hard to read.

Best of luck with the content creation!

Thabo Pali • Jan 12 '21

Thanks for the feedback, I appreciate it.

Madza • Jan 12 '21

Awesome to hear, you are welcome 😉👍

Maulik • Jan 18 '21

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/

Oğuzhan Olguncu • Jan 11 '21

ogzhanolguncu.com/
Not really a portfolio site, but I would like to hear your thoughts.

Madza • Jan 11 '21

What I liked:

The site is very snappy.
Clean and professional look.
The profile picture fits well.
Great color scheme.
Colorful tags give an awesome accent.
Great dark mode.

Some ideas I would consider:

I would change Playfair Display font to something different. The Inter font is beautiful, keep it as it gives an awesome and quality look.
I would improve About me and Timeline. Try to add some illustrations or even better - some images of yourself. Some visuals and accents are missing, it feels kind of unfinished and plain at the current state.
Add some more line-height to blog titles. Currently, multiple line titles look pretty squeezed. Aim for something like you use in the Hero area description left to your picture.
I would probably add some background to the footer (navigation + social media icons). Like some very light grey or smth (like you use in View all button), so it is easier to distinguish where the content ends and the footer begins.
Give feedback button currently does not do anything. Add functionality to it.
Test your site for smaller screens. Use percentages instead of fixed values in breakpoints (check between 650px to 768px). If you use fixed values, center the elements. Use text-align: justify for the text when resizing.

Oğuzhan Olguncu • Jan 11 '21

I'll definitely implement those features. Thank you.

Madza • Jan 11 '21

Awesome, it's among the best I've reviewed today 😉👍

ab • Jan 12 '21

This is my developer diary plus portfolio site. I hope you like what you see xD
nikolayivanov.onrender.com/

Madza • Jan 12 '21

It's hard to read, definitely increase the font size for all your content.
Add proper padding for navigation and archive items, they are too squeezed.
Move the social media icons under the description of yourself.
Make all the links, navigation, archive items, and post titles to the shade of blue used in the Choose file button, to give an accent to your site.
Make sure to list the preview versions of the articles and then open them on click. Once you have more articles, you will end up facing that anyway.
I don't think that validator checks are necessary on the Footer.

ab • Jan 12 '21

wow, that was fast XD. thank you so much for your thoughts madza.
yeah, I was kinda scared to use accent colors because images in posts and my portrait art dont blend well sometimes/not consistent, so i went with a gray tone instead. I like the preview articles suggestion, sounds nice and I see it a lot too. yeah the validator checks just look retro to me XD

Madza • Jan 12 '21

Awesome to hear, hopefully, you find something useful 👍😉

Rajat M • Jan 11 '21

rajatm.netlify.app/

Thank you for taking the time out to do this! Would love to hear the feedback.

Madza • Jan 11 '21

What I liked:

Awesome loading animation during the opening.
Sleek hamburger menu at the top left.
Good looking About me and Footer section.
Section titles look good and well highlighted with that bottom border.
Looks good on mobile.

Some ideas I would consider:

Try some background gradients that are easier for the eyes. If red is your favorite, that's fine too.
I would change the fonts used. Try something like Nunito, Montserrat, Quicksand, and Poppins.
Currently, you position your social media both in the header and footer + there is another Get in touch section. I would replace the icons in the top right with the menu consisting of the sections you have. And leave the hamburger menu just for the mobile devices.
Clicking on 'Get in touch' gives me a white flash before opening mailing options. I'm on latest Chrome.
For projects, you currently use GIFs just on hover. I would remove the zoom effect and display GIFs right away, instead of static images.
For projects and blog posts I would re-style the cards, giving them proper padding and background color. Or remove the borders at all and leave them open.
Increase the font size for the description of the cards.
Use more high-quality images for blog cards. Currently, they seem to be compressed or even streched.
Add some icons to your skills section, so they are not just plain text.
Back to top button should be sticked to the bottom left no matter the scroll position. Currently, you display it only when the user reaches the bottom.
Decrease the Get in touch section font size on mobile devices.

Rajat M • Jan 12 '21

Thank you so much for such a detailed feedback, will work on it immediately!

Madza • Jan 12 '21

No worries, hope you find it useful 👍😉

stephen • Jan 11 '21 • Edited

sharosky.wtf

i mind changing it but idk really (also i know responsivity is sh*t)

Madza • Jan 11 '21

What I liked:

The color scheme is awesome, goes well together.
The originality of the layout.

Some ideas to consider:

Distinguish what are your skill icons and what are your social media ones. Currently, it's very easy to mistake and first I thought they are all skills.
Add some interactivity for the buttons and add some exciting colors to them.
If you want to display projects as cards, I would make them bigger, filling the available space to the right (at least while you don't have more projects). Give them a title and a short description of what each is about.
You use large images for your projects. Make sure you lazy load them or find some other alternatives, so they load smoother.
Include the live links to the projects and source code links (if available for the public).
Add a favicon to your site.
Consider including a bit more about yourself and how to contact you.
The site is not currently responsive, make sure it looks great on smaller screens.
Fix some console errors.

Maybe Nuts • Jan 12 '21

Https://Arnav.upon.one

Madza • Jan 12 '21

I like the minimalistic approach.

Change the terminal background to some dark tone, not completely black, but like some very dark grey to simulate the look of an actual terminal.
Make social media icons bigger.
Remove the name from the terminal top and place it under your image, increase the font size of it a lot, and set the text color the same as you use in the terminal background in #1.

Maybe Nuts • Jan 15 '21

Thakyou so much for this detailed review. I will work on the mentioned points. I also wanted to add more content to the page like project details, and my art, without breaking the minimalism but I don't have any ideas. Please help

Vaishnav • Jan 12 '21

Would love to here your feedback.
vaishnavs.netlify.app

Madza • Jan 12 '21

Not the first time I've come across this portfolio. And I like it.

Fix each and every page on Dark mode loads through white flash.
Try to find a better shade of that grey for Design & Code
Also change that background color for Projects to some darker shade, closer to the main background.
The same as above for Footer.
Use the white font for Projects text

Mitchell Tsai • Jan 12 '21

mitchelltsai.com/

Madza • Jan 12 '21

I like the clean look and feel of the site.

I would increase the max-width of the main container a bit.
Remove that vertical line under 'I am a full stack developer'. It looks great for sections, but in the landing area, you need to be more general.
Add some illustration next to about me, to fill up space and make it more visual.
Bold your name beside the profile image, so it is different from nav items.
Section titles font sizes should be way bigger, they start new sections after all.
Avoid using percentage skill bars. You will be asked how did you measure them.

Mitchell Tsai • Jan 12 '21

Thanks for the helpful feedback. Really appreciate it :)

Madza • Jan 12 '21

Awesome to hear! 😉👍

Dalitso Kasonde • Jan 11 '21

dalitsokasonde.com

Madza • Jan 12 '21

The site can't be reached 😒

Dalitso Kasonde • Jan 12 '21

Sorry about that
dalitsokasonde.com/

Madza • Jan 12 '21

Nice dark mode switch.
I like the fonts and overall feel of the site.

Remove Welcome to my portfolio website!
Hard code I'm Dalitso and remove that animation. Use black for the name as well.
Make Say hello 100% with, otherwise, the footer does not look centered.
Add favicon to the site.
Clicking on Dalitso on the top left should take users home, currently, it does not work.

ヘンタイちゃん • Jan 11 '21

Here's mine:
hentaichan.pythonanywhere.com/home

Madza • Jan 12 '21

I like the landing and the contacts page.
Also, 3D text and glitch effect goes well with your theme.

Include images for blog posts,
Make sure you can open blog posts on your site,
Change Navigation and Footer fonts to something different and increase the size. Try to change their text color to white to increase contrast.,
Put that grey to something a bit darker (close to that dark shade at the very top),
Customize the buttons - Code, Docs, Read more, etc.... (currently you use some framework, I can tell),
And best of luck to create content and include it.

Comment deleted

Madza • Jan 12 '21

Nice one to begin with. Use behance.net and dribbble.com to inspire you in the future and find new ideas for UI.

Spruce • Jan 11 '21

spruce.com.ng

Madza • Jan 12 '21

Articles, when opened are nicely formatted.
Great use of fonts throughout the site.

Increase the height of the landing area (in purple)
Add some margin under Get in touch.
The images for your articles on that layout would look great.
I would show the description right away without hover. Remove that effect, since it's odd.
Use some bright green or blue for buttons like View Archives.
Use a higher quality image on the About me section.
Use icons for social media in the Footer. There are too many links currently.
Don't do grey on purple on the Footer. It's hard to read, since no contrast.

Spruce • Jan 12 '21

Thanks..
I'd definitely work on it

Madza • Jan 12 '21

You are welcome 😉👍

Jaime • Jan 12 '21

jaimesenoret.web.app/

Made in flutter, not too good but its simple i think. Thanks in advance.

Madza • Jan 12 '21

It's good to start with. Make sure you set the footer at the bottom and make cursor pointer when hovering over social media icons, so the user knows they are actually clickable 😉

Ewelina Krzeptowska • Jan 12 '21

jkrzeptowski.pl

Madza • Jan 12 '21

Add some image or illustration in the Hero section (on the right).
Make navigation items white while on a purple background. Change them to grey when scrolling and reaching the white.
Use different colors for your greeting text. Currently, it's all white.
Remove the 'Social' name in Contacts, leave just icons.
Use the lighter shade of grey on the borders of Contact input forms.
Add some padding and center the Footer content.

Chetan Verma • Jan 12 '21

chetanverma.com/

Madza • Jan 12 '21 • Edited

Moder looking and awesome contrast.
Awesome animations.
Great use of space.
A pleasure to look at.

I would say among the best I've reviewed here.

The only thing I would consider to improve is to host the blog on your own site, currently, you are redirecting to Hashnode. Make the content fully yours.

Chetan Verma • Jan 12 '21

Thanks for your awesome feedback.
will surely host the blog on my own.

Madza • Jan 12 '21

Good job on it mate 😉👍

Devansh Soni • Jan 12 '21

devansh-07.github.io/
Thank you :)

Madza • Jan 12 '21

I really like that animation around the profile image. Reminds me of Atom's landing page.
Nice fonts and well-positioned content.
Nice feel to the site.
Easy for the eyes.

Add some icons for skills.
Add some images for and projects.
Remove the blurred image in the Resume. It does not belong to the overall feel of the site.

stephin007 • Jan 12 '21

stephinreji.me

Madza • Jan 12 '21

Increase the size of the logo.
Avoid that yellow on that background, there is no contrast, and hard to read when on grey
Increase the size of social media buttons.
Try some different fonts.
Do not use percentage skill bars. You will be asked how did you measure them.
Add the Title and description for each project, without the need to hover. make cursor pointer once hovering over Dark mode toggle.
The same as above for live links and GitHub (if available)
Use the lazy loading for images in Projects.
Add some footer to your site.

stephin007 • Jan 12 '21

Thanks, will consider the points :)

Madza • Jan 12 '21

Awesome to hear, happy to help 👍😉

Andrei Gatej • Jan 11 '21

andreigatej.dev

Thanks for the opportunity!

Madza • Jan 12 '21

Change the font for your greeting message or decrease the letter spacing. Bold it a bit.
Use a higher res image if you have one.
Stack the text in the landing area. Currently, it stretches and uses just 2 lines, use vertical space more.
Change the icons of Work cards and change the content fonts in them. Change the background to what you have in the Header.
Remove the Contact in the Footer and center the icons.

Eulier Gonzalez • Jan 11 '21

Hi!
eulier1.github.io/quieneseulier1/

Madza • Jan 12 '21

Good looking about me section.

Make sure your name in the top left is clickable and takes you home.
Add some image of yourself in the landing area, or an illustration at least.
Consider including navigation in the top right, that scrolls to a specific position of the site.
Move the linked in and Contact me to the bottom right.
Add title and description for the projects.
Add links to opensource (if available) and Live links for the projects.
Be more detailed on the services. Currently, you have just four icons, which is too general.

Shriji • Jan 11 '21

anoram.com/

Madza • Jan 12 '21

The landing area lacks some image or at least an illustration.
Make the logo bigger and bold it a bit.
Create a title Projects above the images, in the same color you use in the landing desription.
Create a Title above each image and add a short Description under each image. Currently, it's hard to understand what they are about without opening them.
Add some slight zoom effects once hovered over the images to give some interactivity.
Add more links to projects, like to opensource (if available), and add some description for each of them.
Remove About us under the last project since you already reference it in The landing area.

Sabesan Sathananthan • Jan 11 '21

sabesansathananthan.now.sh

Madza • Jan 12 '21

I'm not a fan of fonts used. Try something like Nunito, Montserrat, Quicksand, and Poppins to make it look more modern.
Increase the font size used in the buttons.
Increase the top margin for the buttons below Projects and Blog.
The about me section feels unfinished and lacks some more images of yourself. Currently, it's just a blob of text.
Make sure you use lazy loading for images in the Media section.
Re-design your pagination component to look more in the lines with the overall look of the site.
Remove the Google calendar embed, it feels odd there.
Make sure you include the title and the description of the projects under the image not on top of it. Currently, it is hard to read.
Give a proper margin for the items in the Contact section. Currently, everything is a bit squeezed.

Cameron Thompson • Jan 12 '21

cameronthompson.io

Madza • Jan 12 '21

Looks clean and I like the font you use.
Well executed More about me and Top technologies section.

I would remove the background color of What I Do, to stick with the theme.
I miss some interactivity on hover. like zoom in cards on hover or change color of menu items when hover.
When clicking on Load more, make sure you position the navigation items to right (like you have on the landing page), so you don't confuse the users.
Add that lighter shade of blue to your Articles section, so it is easier to distinguish between Projects and Articles. And that way your site would follow the pattern.
Consider opening blog posts or projects directly on your site. Currently, you fetch them from DEV or add them manually and point users to outside sources. Use the advantage of your site to give more description of them to create separate pages for all your projects. I would suggest to use Contentful for CMS and start from there.
Increase a bottom margin for Articles.
Increase a top margin for the footer. And remove the computer icon there, since it feels odd.

Daniel Major • Jan 11 '21 • Edited

Your initiative is really cool, here is my portfolio danielmajor.com.br, I need new ideas to improve

Madza • Jan 12 '21

The landing area font looks good.
Nice background color for white and grey text.

Make the logo slightly bigger and the navigation items slightly smaller, to highlight the logo. Try different fonts for the logo, or generate a new SVG with some logo generators.
Change the background color for the Header to something darker and based more on grey not brown, since it does not go well with your main background color. Same for other panels you use that shade across the site.
Increase the profile image size.
Increase the font size of your name and position Frontend Developer directly under it.
Make the tags different colors to give some accents.
Create a sorting algo, so that clicking on each tag leads to projects specifically built with particular tech.
Make the font size of Project descriptions smaller.
Can't really evaluate the Blog section, since no genuine content there. I would suggest include some images there and make sure users can open the post directly on your site.
The Stack content loads slow, see what you can do with it. I would remove the Stackshare embed and create a custom component for it. If you stick with embed, make sure it opens in full height, so the users can see the content without scrolling.
Center the footer content, so it feels right on every section of your site.

Burak Saraloglu • Jan 12 '21 • Edited

buraksaraloglu.com

Madza • Jan 12 '21

The project section looks nicely formatted and clean.
Great that users can open the projects directly on your site to read more about them.

I need a picture of you in the landing area.
Increase the font size of your name and use a dark grey shade to highlight it.
Make links of different colors, like light blue or something to highlight them.
Use a darker color for the scroll animation, it's hard to see currently, and I would guess there is no more content in the initial launch.
Add some background color for the buttons, like a light blue for Live demo and grey for Github. Change the font color accordingly.
Use some lazy loading for your images, currently, they do not load smoothly.
Include resume link in the landing area and remove it when scrolling
Consider including some footer for the site.

Nil Madhab • Jan 11 '21

nilmadhab.medium.com/, webtutsplus.com/

Madza • Jan 12 '21 • Edited

The first is just a Medium profile, so it would not be fair to judge. If you are using it for your Blog that's absolutely fine.

About Webtutsplus:

The site needs more content,
Use SVG for logo,
Create separate links for login and signup,
Remove the play button,
Format your screenshots in Carousel properly (currently I can see browser tabs on some of them),
Make the description about what you do bigger,
Add some icons for links,
Add some social media info (currently there is no way to contact you).
If you are using WordPress, maybe switch some themes, WP has a lot of customization options.

Abhishek Prakash • Jan 11 '21

abhishekprakash.com

Madza • Jan 11 '21

What I liked:

The image is great and fits well.
The overall look and feel of the site.
The double-column layout makes it very easy to navigate.
Looks awesome on mobile.

Some ideas to consider:

Increase both font size and icon size on the left side. It's the main section and all the info there should be highlighted a bit more.
Change the section titles to darker shades to accent them more.
I'm not a fan of percentage bars for skills. They might look great, but an interviewer will ask you how did you measure it and know that it's exactly 65% or smth.
The right panel should end with Contacts (on desktop view). Copyright section there feels odd, whether remove it completely or move it to the left under social media icons. For the mobile view, it fits well at the end of the page.

Chomtana • Jan 11 '21

chom.dev

Madza • Jan 11 '21

What I liked:

The speed and overall UX of the site.
The resume layout used to present the info.
The fonts look awesome and very clean.
URLs with hashes to forward the user to a specific position.
The profile sidebar looks great and well-formatted.
The way the contact sidebar is stuck for easier access.

Some ideas I would consider:

Each time I refresh your page your image loads through the blur. Consider not using any effect for it, since it is very small and could be well compressed for that size. So it would load fast by nature.
I'm not a fan of the yellow-brown color currently used for buttons. Try the shades of other colors that would fit well with yellow. Probably that green used in line.me would look neat. Especially for both Send buttons.
I would do all the Choose your Question buttons in different bright colors since they represent different questions. You need to highlight them if you want users to click them. Currently, they look pale.
I would sort the skills differently. Try to put them into thematic blocks and display them horizontally (use 3 column layout). You can leave them as a list for the mobile screens if you want.
Contacts section seems to be missing on the screen-sizes 650-1000px. See how you can implement them without breaking the layout.
Fix the console errors and remove the unnecessary console logs.

Martins Gouveia • Jan 15 '21

martinssilva.github.io/

Gedalya Krycer • Jan 12 '21

gedalyakrycer.com

Thanks in advanced! I’m about to do a bit of a redesign/restructure soon, so any feedback before then is much appreciated.

Madza • Jan 12 '21 • Edited

View resume button should be more highlighted, use some bright green or blue.
Increase the font size of the text of the landing page.
Remove the section above Footer. You don't need two footers one above the other. Built with info is enough.
Add title and description for projects without the need to click on them.

Iñigo Ochoa • Jan 12 '21

inigochoa.me/

Please don't be too harsh, it's still in development 😀

Ryan D. Lewis • Jan 11 '21

ryandlewis.dev

I'm not really a web developer by trade, so I would appreciate any feedback! Been slowly iterating on this guy for awhile.

Madza • Jan 12 '21 • Edited

Move your image from the top to the available space right to your description and increase the image size after that.
If you do #1, add the introduction text above the Navigation, like Hi, I'm Ryan or smth. Make sure the font size is big enough, as it would be your main title.
Are you sure you want to use that dark green? If you like green, make try out lighter shades, it will look much cleaner that way.
Use 2 column layout for posts, where there is the title is on top and then the image in the first and the description on the other.
Add images also when the Posts section is being opened.
The projects section looks good if you prefer lists.
Position the links horizontally to use the available space on the desktop view.
Make the content of the footer bigger, currently, it's too tiny.

Sulman Baig • Jan 11 '21

sulmanweb.com

Netlify vuejs frontend
Dev.to backend api

Madza • Jan 12 '21

Try darker background shades for those panels. And lighten the body background.
Remove the image in the Header. It duplicates the one you have in the top panel.
Move navigation items to right (to the point where the content ends on the right)
Align the text of the first panel to the right side.
Add some different colors to the links to give some accents.
Consider using white text color. It would look great if you do #1.
Make sure you use white social media icons.
Add images for blog posts already on the main page.
Use lazy loading for images once you open blog posts.
Put posting date and tags under the title and give proper padding for them. *Use some bright green or blue to load more button background.