Before & After: Small Business Websites Redesigned

In the month of October, we ran a super exciting challenge for our Flux Academy students.
We had them redesign the website of one of their local businesses as well as explain their process.
Given the way the pandemic has affected small businesses worldwide, this felt like an awesome win-win. It led to over 50 redesign submissions and spawned a plethora of beautiful web design.
Here's the list of the project reviews (unfortunately additional resources no longer available):
1. [WINNER] Social service agency by Nadirah K
2. Business consultancy by Felixander Yuan
3. Digital recruitment by Giuseppe Farina
4. Popcorn club by Fernando Bisca Escanhoela
5. Hot Dog resturant by Alex Presa
If you're interested in working with any of these amazing designers, check out their personal websites below:
Winner
Nadirah Khaliq
www.thrivelystudio.com/
Honourable Mentions
Alex Presa
www.alexpresa.studio/
Fernando Escanhoela
_hippodesig...
Giuseppe Farina
www.giuseppefarina.com/
Felixander Yuan
felixanderyuan.com
Timestamps:
00:00 Intro
00:25 The Redesign Challenge
1:20 Hot Dog restaurant
3:15 Popcorn club
5:05 Digital recruitment
7:00 Business consultant
9:55 [WINNER] Social service agency
-
Learn how to build custom websites with Webflow FAST:
bit.ly/WebflowWebclass2020
-
Find me on other social media platforms:
Instagram: / ransegall
Twitter: / ransegall
LinkedIn: / ran-segal. .
-
Gear & Book Recommendations: bit.ly/2ohFOuj
#websitedesign #webredesign #freelancedesign
Thanks for watching the video!

[@proudofmokum]

The popcorn website was definitely the best.

[@kimbleeworks2439]

Agreed

[@MichaelMarosi]

Agreed

[@AbdulMajeed-pl8jg]

Agreed

[@tonimaunde]

Indeed.

[@Figgen]

what would mobile look like for that??

[@92soldier]

Hey bro can you make this a series!? This is soo cool

[@kiromell]

Yeah it would be really interesting to make other videos like this one. Nice concept

[@FluxAcademy]

So happy to hear this! Let me think about it, ok?

[@adebowaleselere4254]

@@FluxAcademy would be so nice if you could. It is very interesting to see how design could be improved. Because that popcorn website was like 😮😮😮😮😮🤯🤯🤯🤯🤯🤯🤯🤯.

[@lukasivanovic5317]

Would definitely love it! It's really a good way of learning for me. Seeing the knowledge used in real projects with a reasoning behind it 👌 Thanks to all involved in this video 🙏

[@khoinguyen-ft2ys]

@@FluxAcademy Please consider it

[@Digitalism_]

I really love the idea behind the winner's redesign and particularly replacing the CTA from "Donate" to "Make a difference". The little things really does make the difference!

[@FluxAcademy]

💯

[@wioetuw912]

The new CTA is too vague. You could tell about the difference making in the headline or a subheadline but if the button is for donating then it needs to say so in a clear and unambiguous way. The most important rule of web design is that you must not confuse the user.

[@tikusblue]

@@wioetuw912 Im guessing when you click it though, it directs you to that donation window or section which will add clarification. Plus, you can already scroll and see the ability to donate too so i think it works. Many may also find it off putting to see a donation button right when you open the page, rather than information that includes other ways to get involved

[@hypeengineoverload]

@@wioetuw912 ppl will know. People are not that dumb they will get confused on something like this

[@kaPaURL]

I love the popcorn redesign. Looks amazing.

[@FluxAcademy]

👌

[@kaPaURL]

@Col Which one did you like?

[@dustinoverbeck]

I agree, I think either the popcorn one or the business coach were the best redesigns. They were really transformative and had a layout that was well thought out.

[@arunashamal]

I think that is the weakest one! reason.. The logo.. The re-designer jumped into a new typography trend without taking the design cues from their existing logo... which is cute and flowy, and he just redesign it to look like stuck up software company with the swiss style re design. The disconnect between the logo typography and even the images kills it. It goes from nice fun and cute looking logo to a, typography of a financial company and photos of an instagram feed... This is why you shouldn't jump into trends without studying it first.

[@akashkumar121213]

It reallyy ...................... Popped Out

[@lika_cola]

The best was the Popcorn! It was a mind-blowing change. So unfair that it didn't win. You should give it the audience choice award :D

[@MichaelMarosi]

The popcorn was incredible

[@oussamabouyardane2431]

It's not only about how the design looks like but is about how can you improve the user experience as well and the last one did a really good job and really make a valuable difference to improve donation rate!!

[@tikusblue]

It was a more drasti change, but that doesn't mean it was abetter change than the winner. Imo the winner definitely deserved to win, they didn't only make it look better they also drastically improved functionality in ways that will 100% improve their business goals and amount of donations.

[@jayreambonanza1991]

It was the best one visually but on the marketing and UX side, it has lots of buttons and CTAs are all over the place in the hero section.

[@cristianjuarez1086]

@@oussamabouyardane2431 nah, popcorn did better, the last one won because he wanted to favour the cause

[@dhineshvm2184]

Popcorn Club 🔥 Fernando

[@FluxAcademy]

🔥 🔥 🔥

[@sevenstar3616]

PLZ CONTINUE THIS SERIES, THIS IS INSPIRATION WEB DESIGN

[@FluxAcademy]

we will! 🙌

[@Vancittyy]

Must've been trying to date the one who won... haha no shot that Popcorn site didn't win. Great job my guy-you're one hell of a designer.

[@FluxAcademy]

Thanks! 🙏

[@ajfrancis6365]

Lmao ikr. That design legit blew my mind

[@HDMOVIECREATOR2012]

That progress bar for donating was really smart!

[@bluemoon1972]

I think it was brilliant, but needed just a touch more clarity -- the big "300" didn't say enough; perhaps adding a few words would be helpful. Maybe right above or below the 300 it could say "Grow this number" or something like that.

[@HDMOVIECREATOR2012]

@@bluemoon1972 You are right! 300 was a little bit vague

[@tikusblue]

@@bluemoon1972 I think it should have clarified "300 students set up for a better future" or something like that.

[@RigelBergonio]

Wow, all these redesigns turned out awesome! Very talented designers. Really enjoyed this video 👏

[@FluxAcademy]

Glad you enjoyed it! Flux students did all the work!

[@CPTZK11]

The popcorn redisgn literally took my breathe away. Amazing, worth every penny plus more

[@bigfoot131]

Wow ridiculously nice 🔥the last site that won had a little going for it before the redesign but the popcorn and the personal business sites really needed a redesign a serious makeover! and the work they did on the redesign was night and day difference especially the popcorn site. All good tho, to be fair I think u should have a viewers choice award to be completely fair. A lot to learn here definitely will be taking some pointers.

[@FluxAcademy]

Thanks for the feedback - maybe we'll do that in future editions 😅

[@hdavid1574]

So this is the man behind the beard... 😅 Keep it up, Ran!

[@FluxAcademy]

Thanks! 😅

[@2Manzy]

@@FluxAcademy lol i didn't notice you have shaved that's why i was getting confused by your new face 😅😅😅

[@losbones]

Does that count as a rebrand?

[@abby7742]

Wow, the popcorn site is my fave. Well done, Fernando!

[@vladislavnegro9324]

Ran: website redesign beard: Ran redesign p.s. i love it tho

[@FluxAcademy]

😅

[@constantavogadro7823]

I thought Tai Lopez took over the vlog 😄😃😃

[@pixel9032]

Diving into web design to make a website for my business and wow, these videos are just incredible! So much value for free, thanks a lot, lots of work to do for me!

[@VenerSarmiento]

Awesome design reviews Ran. The popcorn website really standout for me. I like how the designer breaks down the issues and actually solved it with the revised design.

[@FluxAcademy]

It was a hard choice! 😅

[@BBI-Brandboost]

A great competition and the designs shown look really good. It is always useful to see how other designers approach a website redesign where the process usually stays the same.

[@FluxAcademy]

💯 thank you!

[@BernardinhoBeiraMar]

As a junior web developer, this video brings so much inspiration. Design is not my forte but is always good to learn new things

[@FluxAcademy]

Glad it was helpful! Continue to learn and practice - and you'll see that you'll get there in no time. 👊

[@MrZMaslam]

Popcorn was absolutely mind-blowing.

[@unsignedhub]

I like to flow of the redesign process, it tells quite a good story. This is inspirational.

[@stillready6405]

Very usefull video, thank you very much for that and to all the people who made the redesigns. There was a lot to learn, I also appreciated very much the explanations (PDFs). You all did a great job! Edit: I also love the "real life" examples - so usefull. The thought process behind it was so insightful and sth. You really don't get that in any other videos. That would be a format I would love to see more of.

[@AndreNMailho]

Parabéns Fernando Bisca , o seu layout ficou sensacional. *Congrats to you Fernando Bisca, your layout is amazing.

[@VKIID]

Seeing this now makes me want to undertake a challenge like this! Thanks Flux!

[@SillyWeb]

Damn these were really good. I loved the popcorn web redesign more than the winners redesign.

[@Dramko]

Those redesign are fantastic! I'm really absorbing as much information as I can

[@brownsugarbranding]

The business consultant redesign was the best in my opinion. Just really cleared up my confusion with the site.

[@user-bo9rl6ro5s]

Thank you for this format! I enjoyed a lot watching these transformations. Designer are so talented. Please more videos like this!

[@nickjones605]

Great vid, thanks-a lot of great insight here. Congrats to all the designers and the winner. Well done.

[@FluxAcademy]

Awesome! Our students made my job super easy! 😎

[@normthomas5028]

Those are excellent! Glad to see all the Foodie sites in there! Where do my cohorts get the time? ❤️🤲🏻

[@ajfrancis6365]

Bro that popcorn guy is a literal god. IDK how they didnt win ;-;

[@AFMCarlos]

What a surprise to see how many fellow brazilians follow your content too, nice

[@FluxAcademy]

🙌🇧🇷

[@kingkhi3497]

All them are major improvements the popcorn is my favorite redesign

[@brooksgunn5235]

The popcorn redesign was incredible, but the donation website UX change was radical!

[@cheapwebdesign2695]

Always enjoying your videos! I really feel the way the consultant website has been re-designed so good! The designer took great effort to see what the website needed. To know that visitors DO NOT read, and for that sense recreate the website in a very clean color pallette. Same goes for the recruitment website. Love the color pallette and the way its redesigned. Clear information about what the website is about, and landing page in F shape with 2 CTA buttons in the main lander. I love it! Keep up the good videos ❤️

[@egoiisticprince7977]

I loved business consultant and that popcorn

[@FluxAcademy]

happy you liked them! It was a tough choice!

[@YuanH]

thank you, Good to know that you like the consultant website redesign! 😁

[@franciscofreitas6695]

Ma man used a Spanish accent to read Portuguese... As a portugueses man that hurt a bit but enjoyed and learn a lot keep up the good work my guy!

[@debf4992]

They were all very well done. I really liked what Giuseppe did with the logo.

[@archevallaran2005]

Sorry, I love all the transformations but the popcorn one stands out for me.

[@rohithdsouza8]

The popcorn website just instantly blows your mind!

[@mohammadosman4102]

The popcorn club redesign was just mindblowing fr

[@sophiesergeevna7587]

This video is amazing for beginners like me. Thank you so much. I'll go to check all the full presentations and enjoy the inspiration.

[@Jacob-iv7qg]

love it, can you make more of this? but focusing more on "breaking down the problems", thank you anyway!

[@victoremisho9432]

That Fernando guy is absolutely wildddd!!! Dammnnnn!!!

[@FiqZz_]

Man i got recommend on 3.00 am 😂😂 love it

[@ayafathallah3274]

Smashed the like button when the popcorn site redesign came on @4:12! Amazing!!

[@pein1011]

Really love this, thank you very much And to all 5 designers, their works is awesome, I learned a lot from it :"D

[@henrythomas7112]

Love the quality of your videos and the value you're providing! Thank you very much for your hard work.

[@nicktolentino8250]

Hands down the Pipoca site won. I would have liked to see individual popcorn sprinkled on the homepage but the redesign is the best.

[@CPTZK11]

Concerning the winner website AWWA, an improvement I could see instantly is to change the colour of the call to action button because it blends in too much with everything else, it is the same color as the loading bar so is not easily distinguishable. Minor nitpick you could say but it really stood out to me the unusual blend of the call to action button with everything else, not much of a heriachy there. Nice redesign though!

[@gcbicca]

Wow!!! What awesome redesigns! For me, both the popcorn and the donation website stood out as the best.

[@dimitridehouck9506]

Love this! I learn so much from this! Thank you so much for sharing!

[@FluxAcademy]

Glad it was helpful! thank you! 🙏

[@anthonyprasad1402]

These are amazing! Motivates me to continue my own web design career. 🔥🔥🔥🔥

[@FluxAcademy]

Great to hear Anthony! You got this! 👊

[@PedroNogueiranunes]

Fernando NAILED IT. Parabéns irmão

[@SuperDarmino]

idk about you , well i know because you already chose the winner BUT.. the popcorn redesign tops the pops for me. Great redesigns overall

[@FluxAcademy]

For sure! Fernando's work was amazing, but Nadhirah's addressed some other points that were really relevant to the challenge.

[@SaltLake180]

@@FluxAcademy Might be relevant but it was still a mediocre site as compared to others.

[@AdrianToddRoss]

These were all amazing!

[@yolandabenz4115]

This is awesome. Is there a way to see their responsiveness and translation to mobiles? Some of us may have a more 'mobile-first' approach to design so would be awesome to see some examples of that too.

[@officialfretsonfire]

That is the #1 question I have watching literally all of these design channels. What is the point of doing all this fancy design without showing how it looks on mobile when everything collapses into single columns.

[@jdherbig]

amazing challenge. the presentation decks are amazing!!

[@kelvezu1585]

Loving this kind of content. More of these please.

[@FluxAcademy]

Glad to hear! thanks 🙏

[@annlishchynska978]

The 2nd and the 5th are amazing 😍

[@FluxAcademy]

🙌

[@JaysonClarit]

Really love the redesign process :) Thanks for sharing this helpful video.

[@DomenicoMarcoDiDonna]

Amazing redesigns here! Great job 👏

[@FluxAcademy]

Your redesign was also great! Keep up the amazing work!

[@thefaraazansari]

The popcorn website was just awesome 🔥🔥

[@bogdanarehere5855]

AWESOME VIDEO!!!!!! Hope you will make video like this every week. Thanks, man!!!!!

[@FluxAcademy]

More to come for sure! 😊

[@isaquecastro2849]

O cara que fez da pipoca é brasileiro, caramba! Ficou incrível!

[@luizinniziul2976]

Ficou massa mesmo

[@AlexPresa]

YESSSSSSSS!! Thank you Ran and team at Flux!!!!! :D

[@FluxAcademy]

Congratulations Alex! 👊

popcorn redesign is amazing!

[@zaka9862]

The second to last one looked like a horrendous mess before the redesign. The last one was a job well done I think but the donation site was a least functional looking for the most part beforehand by comparison to the 4th one haha. Also, the popcorn redesign is really really nice. The hero for it is fire. My top ones for the redesign is #2 Popcorn Site and #4 Business Consultant.

[@sweetstuff55]

This is awesome and very helpful! Another great video :)

[@FluxAcademy]

Glad it was helpful!

[@mitch761]

Thanks for putting up the presentations and great work from the students. It’s really useful

[@FluxAcademy]

Glad it was helpful! 💜

[@SaSha-hb5rq]

So many talented designers out there. But they should do a version of the mobile web too or a mobile-first approach design since most of the web is accessed thru mobile nowadays.

[@anishbakhan310]

all these redesigns are awesome ❤❤❤

[@oliverwenningmann980]

Great picks! Blown away by #2 actually. 👍

[@FluxAcademy]

students did a great job, it was a tough choice! 😅

[@davemence361]

The popcorn one is 🔥🔥🔥

[@FluxAcademy]

it was a hard choice! 😅

[@MichaelMarosi]

I loved the popcorn too

[@zuhranahmed]

Great video. I would say great initiative so that others can also learn how to think out of the box.

[@FluxAcademy]

Glad to hear! 🙏

[@giuseppefarina7393]

Thanks for your feedbacks! Super nice contest 🤜🤛

[@FluxAcademy]

Thank you for being part of this too! 👊

[@stephb7702]

I really liked the pop corn one

[@sapphireyue1324]

I wonder, so in this episode, it talks about before and after of redesign. Is that process consider part of UI/UX? since the students need to understand the client website and identify the problem and make them into a better version of it.

[@scottlau243]

I'm curious how the popcorn one looks on mobile ie. how that vertical carousel would interact on a mobile screen, or if the smaller mobile screen would break the hierarchy that's established.

[@diwakardayal954]

Every single design is just beautiful thanks

[@FluxAcademy]

I got you 👊

[@musicalboy9122]

You are my inspiration ran !!

[@FluxAcademy]

I'm humbled! Thank you! 🙏

[@oguching]

These are great. I really like popcorn website. How does one learn the problems a website have?

[@rlsimmons1214]

Very enlightening. Thank You.

[@FluxAcademy]

glad to hear that! 🙏

[@trevorhawley1237]

Man great video format super impressed. Those designs are fantastic too. Subscribed.

[@milindkhadse556]

The popcorn website amazing.. please keep posting such amazing videos..

[@Xiox321]

I've been trying to design my own website for years now, like probably about 10 years. I've done websites for a bunch of different businesses, but I just can't seem to get my own in a way that I like it. I'll start working on a design and really like where it's going, but then a week later I'll hate it and start over. I've thought about hiring someone else to do it, but I can't bring myself to trust someone else to bring my vision to life. I've spent years looking for inspiration, including watching a bunch of videos on this channel, but I feel stuck, I just don't know why I can't successfully make my own site.

[@FluxAcademy]

That's totally normal. I'm not also 100% happy with any of the websites I build for myself or Flux, so I just make a compromise and move forward with an imperfect website, course, anything.

[@mr_cupcakes1808]

damn, Fernando... that was dope pra caralho, parabéns!!!

[@carlosalberto-mo1wj]

fernando e pica man, não boto fé q ele não ganhou os airpods

[@ssyedyaseens]

Hey Ran, I had a quick question. Do you need to ask for permission from the business before you include them in your videos?

[@ebylitam]

I really loved the popcorn website redesign... for me, he won 😁😉

[@FluxAcademy]

Fernando's website was great! 🙌

[@pratikrajsah]

We need more of these challenges

[@tonys490]

can do a video of process of trasforming UI xd/figma file to acual site please? do devs still start from scratch and use UI as guide or will they use the same files to code? thanks a lot

[@ultranova3315]

Great video Ran 👍, can you make a tutorial on the different prototype features and how to go about it , as I'm having a bit of a hard time . Like parrallax animation and auto animate etc .

[@FluxAcademy]

thanks! 🙏 re: video, let me think about it.

[@ultranova3315]

@@FluxAcademy thank you , do take your time

[@amourgifting2486]

cant access those report files you've given link below, it can be really useful for us as students, can you please arrange something, I personally want to read the complete procedure...

[@GoldmediaSubscribeme]

Popcorn was the best!

[@RoyPetrie]

Love those videos!! I love the popcorn redesign man! 😇

[@amanda.632]

I wish I could be this talented and creative. Maybe a few years of practicing will guide me there.

[@surendrajat7290]

i am from india ,, you are too inspiring for me

[@FluxAcademy]

thanks Surendra! 🙏

[@tarmac5482]

I'm opening a pop-corn business in hope to get that awesome design.

[@zokheedcovers]

You know who to contact haha

[@stephh_nz]

Whoa super youthful Ran! Great look for you! ... oh and the video is good too! 😅

[@FluxAcademy]

😅

[@armandmorin5016]

ooh it would be cool to submit your website to get sort of "roasted" from a large base of designers and then graph the most common critiques to focus on changes to evolve your website or web page.

[@davidnorris8160]

wow! this is so beautiful and have loved it.