Portfolio Design and Development Process Unveiled - Case Study 01

Поделиться
HTML-код
  • Опубликовано: 8 апр 2024
  • This is an overview of our process for creating a portfolio website for a recent client. The website was designed in Figma and developed using Webflow.
    Mentioned Video:
    Advanced custom properties in webflow: • Custom Properties You ...
    ----------
    If you need a kick-ass Webflow website: www.Kabarza.com
    ----------
    You need help with your webflow build, career and seek mentorship?
    cal.com/kabarza/mentorship
    ----------
    Join the waitlist for my Webflow Plugin: www.flowing.to/
    ----------
    follow me on twitter (X): / kabarza_

Комментарии • 44

  • @Draig.cymraeg
    @Draig.cymraeg 2 дня назад

    Awesome idea.
    Im an entrepreneur, i built my first website... it sucked.
    I then paid for a website and that also sucked...
    Its great to know exactly how designers work and what they need from a client, whilst also giving tutorials and tips on how to expand or tweak a website yourself.
    I may just reach out to you guys in coming months for a price, see how things go.
    Thanks fornthe content!

  • @danielkrategl8512
    @danielkrategl8512 2 месяца назад +8

    14:32 interested in all of it :D Sticky Footer, auto-update copyright date, inline flex possibilities

    • @Kabarza
      @Kabarza  2 месяца назад

      Thank you!
      Noting it all down 📝

  • @webflowandcode
    @webflowandcode 2 месяца назад +9

    Saying how you got the client is a nice touch

    • @Kabarza
      @Kabarza  2 месяца назад

      Thank you!
      I’m gathering feedback for other client projects reviews

  • @davidgoult8694
    @davidgoult8694 2 месяца назад +4

    Definitely would like to know more about the responsive layout 😊

  • @jmcclinton8
    @jmcclinton8 2 месяца назад +2

    I'm a newbie in this. I am trying to put together my portfolio using Figma and Framer. The process is slow and I'm learning as I go. Your process is refreshing to see and the case is very simple and easy to follow.

  • @garyvoigt321
    @garyvoigt321 2 месяца назад

    Very nice walkthrough.

  • @mojito1216
    @mojito1216 2 месяца назад +1

    Absolutely interested ❤

  • @Stae73
    @Stae73 10 дней назад

    Super interesting video!

  • @yanngatignol9126
    @yanngatignol9126 2 месяца назад

    so cool thanks for this !

  • @kishangautam7506
    @kishangautam7506 2 месяца назад +1

    Love these videos
    Please make more videos

  • @erfanrj2780
    @erfanrj2780 2 месяца назад

    awesome 🎉 I love it

  • @Rawo8372
    @Rawo8372 2 месяца назад +1

    Wow grate content❤

  • @shahed2141
    @shahed2141 2 месяца назад +1

    Subscribed !! Love the content 🙌🏻🤍 please keep it up

    • @Kabarza
      @Kabarza  2 месяца назад

      Awesome! Thank you!

  • @oscarmartinlive
    @oscarmartinlive 2 месяца назад

    This is sooooooo amazing! Please make those videos to show how you did those fun stuff

  • @jelilabudu
    @jelilabudu 2 месяца назад +1

    Kabarza, great job there❤.
    I have a copywriting issue I'd like you to address.
    What I'd like to suggest to you is that, you should interchange the smaller text with the Main hero text. In my opinion, the smaller text provide a clear value proposition to the visitor than the other.
    Good luck 🤞.

  • @zeminem35
    @zeminem35 2 месяца назад +1

    Definetly would like to here more with what you do with your other design versions

    • @Kabarza
      @Kabarza  2 месяца назад

      Will make videos on it 100%

  • @liizzset
    @liizzset 2 месяца назад

    Accidentally, this video was giving this video in my recommendations. And love this style of video. I am kinda of a newbie in web and graphic design space. And struggling with getting more clients. I have had a few clients so far. But I wanted a way to get more clients, now and in the future, to have a visual representation of my work. And I wasn't sure if an explanation video of mockups and previous works would be good to display. But from this video, I have learnt a lot about the web design flow and layout of an active website. And a trick or two for using Weebly. And I could use this format for access to future clients too. Definitely subscribing too.

    • @Kabarza
      @Kabarza  2 месяца назад

      Super glad it was helpful. More process videos are coming soon.

  • @franciscopais6683
    @franciscopais6683 2 месяца назад

    Good video dude keep it up. I subscribed.

    • @Kabarza
      @Kabarza  2 месяца назад

      Thank you!
      We got about 10 super interesting case studies that I will make videos about with tutorials in between.

  • @Mariamadk
    @Mariamadk 2 месяца назад

    I really loved the video and would love to know more about the details that must be taken into consideration. I do have a question, does the content of the website is written by the designer or should the client give to me? And can you please do a step-by- step tutorial on how to make it responsive? If we can rebuild the website together in the tutorial it would be perfect. I am a junior and passionately seeking guidance to be able to launch my first job and this video hyped me up to work more on myslef, thank you so much.

  • @joergfrank
    @joergfrank 2 месяца назад

    Nice1! Mach weiter so :)

  • @kaifsuthar8445
    @kaifsuthar8445 Месяц назад

    Can i know 🤔
    why are you using div block to make line on text at
    " you just keep climbing "
    Instead you can use
    Webflow Strikethrough property??

  • @TestBot-uq7nh
    @TestBot-uq7nh 2 месяца назад +1

    Please make a video and show us everything. Specifically the editable footer❤❤❤
    And What is cqw??😅

    • @Kabarza
      @Kabarza  2 месяца назад

      I have a complete video about custom properties where I talk about cqw

  • @ahmadfauzanazhim1539
    @ahmadfauzanazhim1539 2 месяца назад +1

    I'm a framer user, but somehow i see a lot of project preferred to use webflow instead of Framer is this sign for me to learn about webflow ?

    • @Kabarza
      @Kabarza  2 месяца назад

      You could probably do this project in framer as well. But could you make the entire quote section out of one H2? I don’t think so. So the seo and accessibility wouldn’t be great.
      I’m biased. Learn webflow.

  • @jelilabudu
    @jelilabudu 2 месяца назад +1

    Why not make the email clickable to automatically open the user's default email client? I don't know if it's possible code it with Webflow, but that'd enhance the UX of the email element if you could do it.

    • @Kabarza
      @Kabarza  2 месяца назад +1

      It does work that way + the copy button

  • @mado.madeleine
    @mado.madeleine 2 месяца назад

    Could you share an example of those loom walkthroughs you do for your clients? 🙏🏽

    • @Kabarza
      @Kabarza  2 месяца назад +2

      Good idea 📝

    • @mado.madeleine
      @mado.madeleine 2 месяца назад

      @@Kabarza personally, I’d be super grateful! This is my weak point and seeing you absolutely crushing it (especially as a non-native English speaker 🙌🏽) is hugely inspiring. Love all your content ❤️ Thanks for taking the time to share some of your “trade secrets” 🙏🏽

  • @innerinsights224
    @innerinsights224 2 месяца назад

    Is it possible to get a job as solely a webflow developer? I'm not that good of a designer but I know Webflow inside and out. I have been developing websites for 5 years now.

    • @Kabarza
      @Kabarza  2 месяца назад

      Oh 100%
      About 60% of our projects are webflow development only. Without the design. Often clients come to us with their designs ready.

    • @innerinsights224
      @innerinsights224 Месяц назад

      ​@@Kabarza Hi, do you have any advice as to where I can find businesses that are looking for webflow developers? A business similar to yours?

  • @KrishnaKumar-yb3wx
    @KrishnaKumar-yb3wx 2 месяца назад +1

    ❤😮😊 source code

    • @Kabarza
      @Kabarza  2 месяца назад

      Hahah on client projects? No.
      But I will make videos on the exact techniques used with clone ables.

  • @BigWealthySchlong
    @BigWealthySchlong 2 месяца назад +1

    Its not communicating what it should. Imo the whole collab lacked consulting from ur end - I would convince the client that being so stubborn about mountain presence in the header is bizarre. Also, below the hero section, there's not much design done. And the dark text is barely visible on top of that dark mountain, so the last word is hard to read in that H1 heading. Lack of sticky menu for onepager is also a strange design choice. Not mentioning lack of branding, or just a logo of any sort.

    • @Kabarza
      @Kabarza  2 месяца назад

      Generally speaking you are making some good points. But not necessarily applicable to this particular project.
      Also, as mentioned this is the smallest project we’ve done in the past 2 years.
      The client initially didn’t want design and wanted a quick webflow landing. Compare that to the results. Fair?
      Now to your points:
      1. Lack of logo is totally fine at this stage for the client. He has his network and the site acts as a quick home base to have. Not mentioning the clients budget and needs at this point.
      2.sticky menu for a 4 section page is not needed. Everything is half a scroll away. Why give up vertical realste.
      3. The dark text has AAA contrast across breakpoints. Not sure where you mean. The mobile which I said I will fix?
      4. Below the hero is minimal. We had options with more designs but we went with a more minimalist look. This is subjective.
      5. The mountains? They are a part of the brand, look and messaging. It’s about the feeling they convey not the direct association with the service.
      I hope this clear things.
      As I said, you have some valid points. But it all needs to be applied to the budget, timeline and the actual need of the client.