All solutions

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

Building the site in Webflow went smoothly and fast

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

No challenges.

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

none

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

I am most proud of creating a clickable link on the curved arrow icon using Webflow's interactions panel to open a modal window showing social media icons without any JavaScript coding.

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

This was my first time using Webflow's interaction panel to create a clickable link for opening a popup window. This requires multiple steps in Webflow. I reviewed several tutorials, some were on webflow.com, some on YouTube, and some AI queries. Some of the tutorials were more confusing than enlightening, but I achieved the desired result by piecing the information together.

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

More detailed videos with examples of using Webflow's interaction panel.

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

Easy and fast

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

none

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

none

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

I properly positioned the logo and images on different breakpoints according to the designs and reconfigured the right arrow for the email submission.

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

The main challenges I encountered were two:

1. I could not position the image of the arrow icon SVG that was given in the email submit button. Instead, I improvised by using the keyboard ">"in place of the "Submit" message and then styling the ">" to match as closely as possible the designs.

2. Properly positioning the different images for the logo and hero image was challenging, but I did position them properly.

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

I would like help with adding an Icon to an email submit button in webflow's form block tool.

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

Responsive views for multiple devices

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

No challenges. Production went smoothly.

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

none

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

Everything went smoothly

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

The only challenging part of this project was positioning the background graphic images properly for different breakpoints. Webflow has a useful tool for positioning background images. The large bg images provided were too clumsy to work with. I exported the clipped images from Figma and used those instead.

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

None

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

The overlay. While I have done image overlays before, coding an image overlay on hover was more complicated than just a static one.

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

Creating the image overlay on hover was a challenge. I had to do some research and review some tutorials. The best answer I received came from the new AI search tool built into Webflow's Designer.

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

All my issues were resolved.

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

sign-up form with responsiveness

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

no challenges

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

none

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

Completed in about one hour with Webflow designer tools.

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

No challenges.

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

None

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

Fast and easy project with HTML and CSS

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

none

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

none

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

I have used success messages before, but this is the first project building a separate success page to navigate to by the user after submitting an email address. Webflow's email is not functional on Github site, so I had to include a separate link to webflow.io to illustrate the functionality this project required.

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

My major challenge was setting up a separate success page for the email submission. I was able to achieve the project requirements after some research and a little help from Copilot. When you access my project from Frontend Mentor, click on the link I have provided to go to another version of the site that fulfills the requirements of this project.

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

After resolving the issue related to the separate success page, everything else went smoothly.

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

Building a Webflow site using an accordion for the first time.

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

Since this was my first time building something using an accordion in Webflow, I had to do some research. I found exactly what I needed on Webflow.com where I found a cloneable FAQ accordion. I copied what I needed to this site and adapted it to meet the Figma designs for this project. The clone had embedded JavaScript, so I did not have to write any JavaScript code. This was a fun project and I learned something new.

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

None

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

I am building these projects faster now. More and frequent practice makes a big difference

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

none

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

none

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

Mobile responsiveness

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

The most challenging part was manipulating the image overlay for responsiveness at multiple breakpoints. Copilot helped.

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

None

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

Building a contact form in Webflow is a relatively easy task using their form block tool. Mostly point/click and copy/paste. Very little keyboarding. If you try to complete and then submit the form, an error message will appear since Webflow does not process submissions except on a live website. Try this link to see more functionality: http://contact-form-ebcbda.webflow.io/

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

No major challenges.

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

None

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

Everything went smoothly. Used Webflow tools for flexbox and CSS styling.

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

No major challenges.

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

None

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

The page is responsive for most devices.

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

A new issue I encountered with Webflow involved styling different text elements in a list with the bold property. Copilot to the rescue. The answer was to replace the list item with a text block and then style the text you add in the standard way.

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

None

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

Responsiveness to multiple devices

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

No major challenges

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

none

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

Most proud: My first project embedding HTML, CSS, and JavaScript code in a Webflow project . The BMI calculator works. Try it out.

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

I am still studying JavaScript and learned enough to tweak the code to make it fit the design files as much as possible. I must admit I did receive some help from CoPilot in writing the JavaScript code. I will continue my studies of JavaScript and hope to be able to post a later version of this web page that more closely follows the design files in Figma.

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

If any Webflow experts follow Frontend Mentor's work, I would like some tips on the best practices for embedding HTML, CSS, and JavaScript code in a Webflow project.

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

I am most proud of the full responsiveness of this site. I struggled with responsiveness at the beginning of this journey, but now I have much more confidence in building responsive websites.

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

No major challenges were encountered. Completing the HTML structure and CSS styling went smoothly using Webflow's tools. I used Webflow's Flexbox on much of the site and spent about the same amount of time on making the page responsive at multiple breakpoints as I did on the HTML and CSS.

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

None

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

The speed and ease with which I could complete this site using Webflow tools. Next time, I will plan the layout structure more carefully, identifying class names, colors, and differences in typography before styling the site in Webflow.

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

none

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

none

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

Finished project in record time.

Insert graphics before completing a responsive design for all breakpoints.

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

The main challenge was dealing with graphics and having to use different ones for some breakpoints.

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

Help with inserting graphic images as background and then editing those images in the Webflow designer.

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

Responsiveness

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

None

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

Graphic designs

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

Building a fully responsive slider project down to 375 px was a rewarding experience.

I added two extra slides to the project. The testimonial photos I got from pexels.com and the testimonial statements were generated by Windows Copilot. Amazing AI app.

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

Working with the responsive design in the Webflow template is somewhat more difficult than the usual responsive design. I had to experiment with this more than usual, but I was able to work through the problems. There was one challenge that I was not able to achieve and that was placing the graphic background image around the testimonial images.

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

Placing the graphic background image on the testimonial images in Webflow.