Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • P
    WB52 100

    @WB52

    Submitted

    What are you most proud of, and what would you do differently next time?

    Mobile first design...

    Next time I would probably experiment and try grid areas.

    Maybe I’d include more breakpoints in the media queries as it goes straight from mobile to desktop and back. I never thought much about changing the design for tablet size, although the mobile will show and work ok.

    What challenges did you encounter, and how did you overcome them?

    I enjoyed getting to grips with grid and found it tricky on the as desktop layout at times but enjoyed the learning process.

    What specific areas of your project would you like help with?

    Any feedback and suggested improvements always welcome, thanks...

    P
    WB52 100

    @WB52

    Posted

    Thanks for taking the time to check out my project/code. I get what you mean about too many sections, I'm still improving my semantic html knowledge. Thankfully it's better than it was when I started as I just used div's for everything!!! There's always more to learn on this path that's for sure. Thanks for your encouragement and feedback...

    0
  • P
    Artiom 120

    @Artiom-Deyev

    Submitted

    What are you most proud of, and what would you do differently next time?

    This time I started with the mobile-first approach, as it was advised. This was a bit unusual for me, but I thin I got it.

    I used Pixelay extension in Figma again to compare the code with the provided design.

    What challenges did you encounter, and how did you overcome them?

    When comparing my code with the design in Pixelay extension, I still couldn't get the font exactly the same.

    Sometimes I had to go against the instructions from the design, to make it look exactly as it is on design (it's usually margins and padding).

    What specific areas of your project would you like help with?

    I'd appreciate to hear others developers' practices in implementing fonts and following design instructions.

    P
    WB52 100

    @WB52

    Posted

    Your design looks close to the original, nice work...

    I've noticed the design images don't always match the figma designs 100%, often spacing is different, or things are misaligned etc. Also there was one where the font had changed slightly on google fonts so the font didn't match the design exactly and threw things out . When all said and done I've realised not to worry about getting things 100% pixel perfect, close enough is good enough to build skills, which is ultimately what we are doing with these projects.

    I did notice one thing that you could change on your project (if you wanted to try and keep to the original design) when it goes to mobile it keeps the border radius top left and bottom left on the image, on the mobile design the bottom left changes to top right so there's a radius on the top corners only. That said yours still looks good as it matches the desktop design by not changing...

    Marked as helpful

    0
  • Aaqib 170

    @aaqibqadeer

    Submitted

    What are you most proud of, and what would you do differently next time?

    ..

    What challenges did you encounter, and how did you overcome them?

    ..

    What specific areas of your project would you like help with?

    ..

    P
    WB52 100

    @WB52

    Posted

    Looks very close to the original design...

    I like the way it goes from desktop to smaller screen sizes on responsive mode instead of going from desktop to mobile design (and vice versa) at a certain breakpoint/s. It's a more flexible approach...

    1
  • @mussino

    Submitted

    What are you most proud of, and what would you do differently next time?

    adjust better the screen size

    What challenges did you encounter, and how did you overcome them?

    media query, I checked online and read how to do better.

    What specific areas of your project would you like help with?

    all sizes of screen

    P
    WB52 100

    @WB52

    Posted

    Your design is larger than the original but a good representation style wise.

    Something I've been using is a chrome extension called PerfectPixel, it helps for getting the sizing more accurate. It allows you to overlay the design files on top of your own design and change the opacity so you can size and line things up better to the original designs. It's well worth a try and it's free....

    0