I built a portfolio in 1-hour, 10-hours, 100-hours! (Using Webflow)
August 17, 2024 2024-08-17 4:58
I built a portfolio in 1-hour, 10-hours, 100-hours! (Using Webflow)
Enroll in Ran’s FREE WORKSHOP to see how the 100-hour portfolio was built 👉 https://bit.ly/3VVMIYR
Learn to build websites like these with Webflow. Enroll in our Webflow Masterclass 👉 https://bit.ly/4aW4v6N
I haven’t updated my portfolio in six years! My challenge is to get my new portfolio online in just 1-hour. Then I’ll do a better portfolio in 10-hours. Finally, I’ll commit 100-hours to creating an award-worthy portfolio!
Check out the sites here:
https://ran-1h-portfolio.webflow.io/
https://ran-10h-portfolio.webflow.io/
https://ran-100h-portfolio.webflow.io/
CHAPTERS:
0:00 Ground rules
0:53 1-hour portfolio
5:48 10-hour portfolio
13:59 100-hour portfolio
Tools used:
Try Figma 👉 https://bit.ly/flux-figma
Try Webflow 👉 https://bit.ly/flux-webflow
Try Relume 👉 https://bit.ly/flux-relume
Fonts used (for 100-hour portfolio):
Power Grotesk by Power Type Foundry 👉 https://power-type.com/
PP Right slab By Pangram Pangram 👉 https://pangrampangram.com/
wooow by Agung Syaifudin 👉 https://www.youworkforthem.com/designer/776/agung-syaifudin
Overspray By Tension Type 👉 https://www.dafont.com/overspray.font
Romie By Margot Lévêque Studio 👉 https://margotleveque.com/products
📱 Find us on SOCIAL MEDIA:
Ran’s X (Twitter) 👉 https://twitter.com/ransegall
Ran’s Instagram 👉 https://www.instagram.com/ransegall/
Flux Academy’s Instagram 👉 https://www.instagram.com/flux.academy/
Flux Academy’s TikTok 👉 https://www.tiktok.com/@fluxacademy
source
Comments (46)
@FluxAcademy
Which portfolio should I connect to my domain? The 1-hour, 10-hour, or 100-hour website?
@mel2669
Ryan, loved this video. I'm in the process of designing and launching a new portfolio. ( For like 5 years now, the struggle is real ). This video was just the inspiration I needed to kick it into high gear. Thanks for sharing and producing this.
@eriszneri
That 100 hour portfolio is so fantastic. I'd love to try it all but I'm just a beginner. I just started to watch your educational videos and I was like "I can learn this in school for few months and pay a bunch." But I learned these things in just few hours and it's so amazing.
Ever since I wanted to do this kind of projects. I just don't know where to go and learn and I don't have much money to pay for school fees. Your videos are absolutely impressive. I can start from those free websites or apps that you have shared. Thank you.
@charithjayanath1292
Wow that's amazing video😍😍
@SaadAlShiekhAli-sg4dl
you are the best of the best, keep it up
@SANDEBRO
All of the websites was good but 100 hour is best one I really loved it thanks for giving us free education ❤❤❤
@SyedMuneebAli
I really liked the idea of 100 hours portfolio as I'm a Designer who do science outreach and communication, loves astronomy and talks about finance. so I can show not only my professional side but also other sides of me. Yay!
@dotes-world
This is the best portfolio I have ever seen! Your creativity and attention to detail are truly impressive. Keep up the wonderful work!
@alexsandrkhaladzhy6386
very cool video!
@Nishitha_Jay
This video is really inspirational! keep up!
@salemnaouai6105
Can't access to the workshop ? It says put your email but there is no space to put it! Can you fix it please ? I adore the work and i want to learn how to do like this
@charityworks.studio
This inspired me to continue working on my portfolio! I think I’ll try the 100hrs. Also the quick review of portfolios were inspiring. Watched it before this one. Thank you, Ran!
@d_maker
10h
@arunn3874
whats the font in the presentation? the 1 looks so cool
@MultiSciGeek
Great work… but something about Webflow seems off… Like the overlay text in each font style looks so cheap. I know it's not you, it's webflow. Been there, done that.
@codedion
You're a legend. Thank you for motivating me to revamp my portfolio
@user-hr2ev3lz7v
The 100 Hour portfolio was just Dope, Fire, Amazing like it was super cool design appreciate all your efforts behind the making of this amazing portfolio video Ran & also your team. Thank you all
@henrythomas7112
Thank you so much for this video. Super helpful and well-presented. Your time and effort is most appreciated!
@mitheomuranga4747
The 10 and 100 hours.
@bjorn9131
you are the best designer in the world
@jessvex
But your actual work gets a single section/image? Where’s the depth and breath of content showing your work approach, strategy, tactics, outcomes, challenges..etc. Tell those stories.
@moonknight-g1t
Man what a video just mind blowing
@user-ln8cg3pf1q
Hey Ran! is there a particular reason for not left aligning the manifest section (10hrs portfolio) for better readability?
@davidkearns6263
The 100 hour website is beautiful, but it's not really effective or accessible. I think the 10 hr website is the best, it shows skill, it's easy to navigate, & it has enough personality to make a potential client want to engage in a conversation about a project, great content.
@evzmeniy
great content!
1/for beginners, 2/ great variants for templates(+ your fantasy+skills))) 3/ max skills+ ect. /////your project
@HEYVIET
Yea, I’m not a fan of these folio sites either. Newbs and pros alike are forgetting the primary reason why we have jobs. The user. Your designs need to be more user centric man. Don’t talk at the viewer….talk with them. It’s what you can do for them, not who you are.
@arienvalmores557
Hats off Ran
@that_crazy_imagination
Please I don know if you will hear me but I will try. Please make a tutorial on how to build blog post graphic and images. The info on this in YouTube is very little and not really impressive
@roieshalom7240
Very creative and interesting in which directions the portfolio can be taken 🙂
@user-Ef6op8qz7f
Please make a video on how to send data[like image, name, price, and description I mean product details] in Firebase through the web flow, without Zapier but also using Firebase cloud function and HTTP request and web flow logic, make this video early because I need it
@Mustaqim11
the 10 hours is beuatiful but the footer on the 100 hr is just sublime!
@RK-mc8zy
I feel so overwhelmed by having to update or create a new portfolio. Adding new technology like AI to build my site gives me anxiety.
@user-mj8vt5kr7o
they are all nice. I am on Flux course 7 days portfolio, lets see what i will create. Can someone link me AI foto maker, thats really cool.
@tjrowe
Eager to see the mobile version of that 100 hour portfolio.
@eduardoluisrl
I think it is not fair to promise smth you won't give to audience. I will do a website in 1hr, oh no wait, i will not do it, i will use a template, i technically will spend 20min to see templates, 20 minutes to download and set up and 20 min to change and upload….
@flow_leit
I have to say, the 100 hours version is trully awesome and well done. It's a banger ! And yes we will love to see a full workshop about this. The animation is the cherry on the top and give a very dynamic experience. I bet lot of people could visit multiple times the portfolio and use different versions "punk/family/…" to have a new experience. Great work !
@jamalcampbell9237
That 100hour site effect is really cool
@sportfanatic9983
A little disappointed with the 1 hour… you didn't even use all the time! Considering that was the most limiting, it would've been better if you added a bit of your own flare to the template. Overall great content!
@davidcrossan
The elephant in the room.
Guys, when are designers going to accept that they should be focusing on mobile design. It's 70% of your audience. Designers deep down know that the smaller screens basically kills great designs or it tougher for the eye to identify a great design.
Just accept it and stop tarting out desktop designs
@herrDOS
Oh, the pain. Haven’t updated mine in maybe 4-5
@ItsEricPhung
What AI tool did you use to create images of yourself doing different things? DALL E doesn't do that I don't think.
@graintocask1615
We are currently at a point where we can build incredible-looking sites that perform well in development environments, but when assessed through tools like PageSpeed Insights, they often return disappointing scores—63 on desktop and a concerning 39 on mobile on your 100hr site. While other metrics may meet expectations, these page speed results are far from ideal, potentially leading to high bounce rates. This is particularly problematic for portfolios, where first impressions are crucial.
This discrepancy suggests that although we have the capability to create visually stunning and interactive sites, the infrastructure—both in terms of web technology and user equipment—isn’t always up to par to fully leverage this potential. It's akin to having a Lamborghini with a scooter engine: it looks fantastic, but doesn't perform as expected when it really matters. We need to continue advancing our optimisation techniques and pushing for improvements in web technologies and broadband infrastructure to truly take advantage of the front-end capabilities we now possess.
@Sydinofficial
Great video 📸
@austinandriese
Love this journey Ran! Excited to see the sites when they come out ❤ So fun seeing your personality on the 100hr site
@bb_4488
The fact you put at least 111 hours into this video is insane 👏
@Dada974_
This is so inspiring 🙂↕️