In the time I should have been doing the twitch.tv project I ended up re designing my portfolio after what was supposed to be a small addition to OLD Portfolio V1.
Anyway, I’d appreciate some feedback on my new portfolio.
I made the tabs, slider and accordion myself (some taken and amended from v1) with the help of a book. There is no bootstrap in this so it might not look as polished as you’re used to, but I have tried to make it look as professional and polished as I can, pending feedback of course
I have an issue in ie regarding cross domain and icon cdn’s which i havn’t sorted yet, so use something (anything!) other than ie.
The UX is sligtly different for tablets and phones than it is for desktop. I tried to make it more like an app on tablets and more like a normal website on desktop (above 1024 wide). that reminds me… I need to add touch swipe too.
let me know what you think and if it’s turned out a better site than V1.
First of all sorry as I was late to notice your post. Now lets talk about the portfolio, That is a hell of a makeover to your previous design. The accordion that Tabs & slider blend pretty well to the design. But the over all site feels a bit congested maybe because of the margins on container in desktop layout. Except that it has a very sleek interface. Well done
Y’know i was looking at it last night an thinking it looked a bit packed.
On desktop, I was thinking it was the progress bar making it look that way but now you’ve said that about margins I have tried the boxed layout slightly wider (11rem or 176px) to 1200px and it does lend a bit of extra white space to the content. I will experiment further with that I think.
I kind of like my progress bar though, so I’d like to keep it. I might make a simpler flatter one and put it in one of those coloured bands, maybe after “i’m available”, see how that looks.
I also think it looks better on desktop if the accordion is expanded by default. I only put that in so I could fit a complete slide panel on a smartphone screen - its really not required once the panel switches to horizontal layout.
I would suggest that you remove the accordion completely if you want to let it be expanded by default and put the content on right side rather then on left, So that in mobile layout the content comes below the image.
As far as the Progress bar is concerned I also like it on your portfolio it just needs to drop some styling and color to catch up with the theme.
And yeah you could use some other font for your name on Navbar.
I amended the accordion so it was just a normal list on wider displays but changes to an accordion when required. Quite pleased with myself because I did that little bit of jQuery / JS from my head without reference - thats a first for me
Also remade the progress bar and it looks much nicer and fits with theme better as you say.
As a side note, you dont need to restructure your html to get the order you want. You can mix it up a bit by moving the elements order around depending on screen size.
With flexbox its just an order: num; rule and in Bootstrap you’d be using push or pull to move elements aroun within rows or columns.
Unique design, but for showing your progress on FCC, I think it is good and I like it a lot. Love that cat and monkey photo too lol
Your textarea in the contact form can be resized screwing up the section - this is easily fixable.
Also, I do not know if you did this on purpose or not, but if you plan on giving this site out to people as your “portfolio” or project hub, you do not have to have https://markj78.github.io/portfolio/, if you name the repository markj78.github.io, you can connect to it with only https://markj78.github.io/ like a normal website. You may not want that idk if you knew that or not.
That is perfect now. The new progress bar is blending perfectly with the site, Header and logo font is also matching with the design Great Job. Thanks for the Ordering info. Actually i never needed it so didn’t know about it. .
Congratulations as well on writing you very first self made Script for accordion. That is definitely an achievement.
Nice work man. Really nice page.
I only noticed that the “curriculum progress bar” doesn’t fit properly in small devices. But I dont know how to fix it. Try to test it for accurate info.
I’m not too bothered about the text area, if someone likes to resize it they can go ahead I think.
Github, yeh I knew I could use the root ditrectory or master or whatever it is, in fact I did used to use it until I made a screw up, a conflict I had no clue how to resolve, with the result being I ended up moving it out and starting a new repository just so I could push again. Once I get a bit better with github i’ll try to fix that no doubt, but for now it can sit in /portfolio. Thanks for mentioning that though because I didnt really know if it mattered but yes, as you say it probably is best.
Not sure if you’re still watching this thread, so I also posted an issue to Github. Other than that, the portfolio looks really cool - I’m hoping to take some ideas back to my own projects. Good luck!