Hi Everyone!
I'm an aspiring developer trying to get my breakthrough in the industry. According to literally (almost)(!) everyone on the internet, A portfolio is the most important thing when you need to demonstrate your skills. So, I took some time to create my first portfolio site.
I'd LOVE you to take a look at it here.
I'm not a designer, but I like things pretty. And simple. But I'm not sure about some of the design/content decision I made. I have lots of questions in my mind.
For example, I've probably added a bit too much text on the About and Projects page. Do you usually read this much text? Also, I'm confused about the tone I've taken on About page. I believe I'm a humble person and I want that to be reflected in my words. Did that happen here? Do you like the colors? Are they too vibrant or dull? Does the animation cause more bad than good? The list goes on...
I'm looking for any and every kind of feedback/suggestions/tips/critique on it. How could I make it better? What would you change? Also, I'd love to see your portfolio so that I can steal some idea and put it on my portfolio. I'm just kidding, Seriously! ;)
I made the site using React and SVGs for animated elements. I'm not at all an expert, so there might be some bugs as well. The site is on GitHub if you want to take a look at the codes. But go through it at your own responsibility cause my code stinks. :(
Now I'm going to grab some snacks while waiting for your response.
Have a great day! :)
Top comments (25)
Very nice portfolio site. Looks good. I suggest adding a title on the main page (like your name). Maybe change "I'm Faahim." to "About Me", and put your name in big letters at the top. It's your site. Give yourself credit! ;-)
That's an amazing idea! I gotta try that out!! 😀
The name needs to stand out, right? The challenge here is, I want to keep the UI as clean as possible. I hope adding the name won't make it look cluttered. 🙂
while(1) {console.log("Thank you! 😁")}😎
Yes. Keep it simple. Just adding your name at the top, maybe left-justified, will say a lot.
It'll be the first thing I'll do when I wake up, I promise! 😄
This was going to be my main suggestion as well. The only other thing I'd consider is maybe bumping up the font size slightly on the page-section titles, but that could just be me.
Otherwise, I think it looks great!
Really cool portfolio! I loved the animations. Just one observation: I have a big screen and the home page felt a little empty. I'm no designer, but maybe some background image or something like that would be nice.
Hi! Thanks a lot! _^
I'm not a designer either, so we're on the same page, haha! I saw through the responsive view that the page looks a bit too lonely. I have no idea what type of content I should add. I'll try out some background image and gradient to see how it looks. Does the other page look alright on a bigger screen btw? I'm a bit confused about the width of the inner pages on bigger screen as well.
But anyway, I really really appreciate the feedback! Thanks a ton! :) :)
Everything else looks awesome on my screen. Love the background colors of each section. May I ask what technologies did you use to build it?
Sure! I've used React, but there isn't much Reacty stuff other than showing the inner pages on click. The animation is done using CSS transform on SVG element. I'm just scaling up the SVGs so they fill up the entire screen and rotating them a little bit. So,
transform: scale(35) rotate(55deg);is doing the magic. :)Thanks again! :)
Thank you!
You're welcome! 😊
Damnn super slick. The animations are super well-done.
I'd say the width on Projects and Contributions and Writings should have a max-width, as it starts to look a bit too wide for bigger screens. And the Writings section might be the place where you go too far with the colors.
I don't think the tone is off, but you could probably be briefer in some of the wordy areas. There are probably details you can leave out, or offer ways to dive further into that if the reader wants.
PS You're welcome to cross-post anything in your writings section to dev.to 😉
Hey Ben!!
Thanks a ton for stopping by! And the animations on your portfolio is waaaay sleeker, haha! :D
The Projects and Contributions and Writings does have a max-width, but I should probably decrease the amount of it.
And about text content, I just went through them some moments ago and found a ton of typo and grammatical errors -_- I'm planning on redoing them. I'll be briefer this time. :)
Lastly, you're absolutely right about Writings color. It doesn't look as deep on my laptop screen. But I tried it on my mobile and eww! My eyes still hurt!
Thank you so so much for taking your time and for the feedback. I really appreciate it. :)
*Sidenote: I'm having some issues regarding my dev profile and I need your help. I've sent you a text on Twitter about it. Not sure where is the right place to talk about it, but can you please check? :) *
This is awesome! I really, really like it! The only thing I would say is that I would make the projects + contributions page a little bit easier to navigate or read quickly -- maybe some sort of tiling with more information available?
Aww! Thank you so so much!! 😊
And yes, The formatting of the Projects and Contribution page needs to change. I was thinking, What if I had some client project and some open source contributing project? How would I represent them differently? I'm sure yet, haha.
But for now, maybe I can add another button under screenshot that says View Details and reveals the description text when clicked. Would that help?
Again, thanks a ton for the nice words and the feedback. 🙂🙂
Very nice!
The only thing that stood out is the scroll bar on mobile view, maybe hide it.
There are small things in your about me text which I would consider over the top. I like your voice but maybe theres no need to capitalise "LOVE" and whilst "And oh, No progress bar showing I'm 93% expert at React, Sorry." is kind of funny, it might be too funny to be included in your portfolio site ??
Also, remove the capital letters after the commas.
I'm not a good speller but by "agonistic" do you mean "agnostic"?
Again, if nothing else, please remove the capital letters, for example:
"Simplicity, Though overused (and sometimes misused) as a term, Is something I really value."
Wow! This is some great feedback. I see that you actually went through the content and I really really appreciate it. Also, thank god you didn't take a look at it yesterday. I had over 50 typo and grammatical errors! -_-
You're correct about the spelling of 'agnostic'. I'll fix the capital letter issues and the spelling soon. :)
I agree with you about the scrollbar and I'm thinking about making it less visible on mobile since I'm preventing the native scrollbar from appearing.
About "And oh, No progress bar showing I'm 93% expert at React, Sorry.", I just realized that it's kind of rude! I've seen a lot of people have those bars in their portfolio and I have nothing against it. But that line expresses somewhat a rude vibe. So I'm gonna remove it.
Also, I just have an idea of adding a live and actual coding stats like this:
in the skill section which might allow me to get rid of most of the text on that page.
Thank you very very much for all the thoughtful suggestions. It'll help me refining the site. Thanks a lot! _^
We, the developers, understand the line. I actually found it very funny - not rude at all. Just that your portfolio will hopefully be viewed by all kinds of people. They might not get the inside joke :)
As a geek I like that graph idea, how useful might it be - don't know.
Well, I thought about it this way: Let's say I'm a person with a lot of those colorful bars on my portfolio. And I landed on this guys site who is saying, Sorry no bars!
I'd get a pinch if I'm a sensitive person.
And you brought up and important point. I need to think about the content from the perspective of a general viewer. And hopefully, it'll be viewed by a few geeks someday as well :P
This is very nice . Well done !
Thank you so so much! :D
Your portfolio is very smooth and nice. What's the UI library you used for this?
And a small suggestion. Isn't it better to highlight the elated small colored (guitar pick like) component on hover ?
Thanks again! 😊
I have used Anime.js for React for only a few transition animation. But the main animation is just pure CSS. 🙂
And, I wanted to keep those colored component passive and only associated with the menu cards. They are highlighted when you hover over cards. But that's a nice idea. I'll try it out to see how it looks. 🙂
very beautiful !
Thank you so much! _^