Portfolio idea
https://www.figma.com/file/6yXavsPf5VVw5xiehZJoDK/Portfolio-Idea?type=design&node-id=0%3A1&t=rzsR8usw44uWtNiY-1
I'm toying around with some portfolio designs and came across this hero section (thanks Misha!). I was thinking about making my portfolio just this frame that's in figma, as I think it would be nice if a recruiter doesn't have to scroll down at all and can view everything really quickly. However, I feel like there's too much there, and it's too much cognitive load. What do you guys think? Should I stick with something more traditional?
34 Replies
I think it's a pretty cool layout
and would translate easily to various screen sizes just from collapsing the columns
Yup that's what I was thinking too. I'm just worried a recruiter might not know where to look and immediately close out of it. But then if I have a traditional layout then I have to worry about whether a recruiter will actually scroll through the content I have π
as long as the 3 images are engaging enough to look at, they will attract the eye and they will see the descriptions etc
and having the CTA button be the only really bright object makes it impossible to miss on this
but you could also consider making the sections accordion style where the details are hidden
and then focus on making the headline interesting enough that they would click them
I"m updating my portfolio right now, and i went in that direction *(using an accordion drop down for each section instead of scrolling the page)
Ohhh that's an interesting idea and it eases what people have to initially process. Nice! Thanks π
Vince π What if:
wow this looks fantastic π€―
Thank you so much!
How do you come up with this stuff? π
I missed the part where you didnβt want to make it scrollable)) But the idea was that they move on their own))
And testimonials on the left was a bit too heavy on the hierarchy, so they can move with the projects))
Another idea is to make it all testimonials, and flip the card on hover, with image and stuff)
Itβs just one fix from what you did) Testimonials were really breaking things on the left))
Yup I agree it's just crazy that you're able to come up with designs like this that seem so easy to come up with but I never even thought about doing it like that π
Comes with experience I'm sure haha
I'm curious about your spacing for the hero text, I spaced mine evenly (24px between the title, description, and button) but it seems like you spaced the title and description together and made the button have more breathing room. Is that a generally better pattern than grouping everything separately?
I wouldnβt say itβs better) For the people who will see them it will make a microscopic difference) Itβs just how I see it more dynamic in this cases: 1, 1, 2 (24,24,48)
Thank you π always wondered about that haha
Here's what I think I'm going to go with:
spaced out the button a bit to make it feel a bit more balanced
As an iteration:
dang this is good!!!
Unknown Userβ’2y ago
Message Not Public
Sign In & Join Server To View
Thank you so much for making a really detailed breakdown π I think you have a really solid point about making my resume the primary CTA, this is for jobs rather than freelance, so I'll definitely do that, as it makes a lot more sense. With the italics I also agree with you, I ended up changing that when making the website. I'll experiment with the button and see if I can make it look a bit better. Also, what do you mean by "not cantering the text"? I've never seen that term before π
Also you make a really good point about the spacing, I always follow the 8 point rule but you're right as long as it's consistent it doesn't matter. Thank you so much again!
Unknown Userβ’2y ago
Message Not Public
Sign In & Join Server To View
Ah got it thank you! I couldn't have gotten this far without everyone's help
So this is what I have now:
as you can see, the images are really out of place... not sure what to really do with the images, do you guys have some suggestions?
https://www.vincewebdesigns.com/employers
Here's the live site I ended up removing the images temporarily
Looking for a frontend developer?
I'm an experienced frontend developer who specializes in designing, developing, and optimizing websites for a broad range of clients. Let's get in touch.
I need some way to make the images fill up I think, but I haven't really found a site that let's me make mockups like those you see on dribbble π€
I also wanted to make the images cover the full card like I had in the mockup but couldn't find a good way to do that for contrast reasons
Hm I have an idea, make it cover the whole card and just display the project title, and have an arrow indicating it can be expanded, and on expansion show the details, kind of like how ghostmonkey and Misha said
Maybe something like:
Once again very clean thank you! Looks great π How did you make those images? Just with some tinkering in Figma?
Just saw the logo at the top too! How did you do that? It looks awesome
Images are just your screenshot inside the frame with an outside border, with matching to bg colors)
Got it! Thank you
Ohh nice! Great way to liven up the page and draw attention to the interactive aspect
Yep) And here's a use of these angled images)
That would be a really fun challenge to code, looks super clean too! Thanks π
Yeah... that too))