Steve Madden clone using pure HTML, CSS & Advanced JS

Vattsal Bhatt
2 min readJan 22, 2022

Hi there, we have experienced our second team project in Masai School on the SeteveMadden.in website clone.

GitHub: https://github.com/vattsalbhatt/steve_madden

Our Project Link: https://stevemadden-project-u3.netlify.app/

Used Tech: HTML, CSS, JavaScript/ES6, Bootstrap
P.S → We haven’t used any external libraries & plugins.

Team: Vattsal, Sahil, Madhavi, Ajinkya, Mayur, Neeraj

#Goals

  1. We need to achieve a good user experience in terms of design and flow.
  2. Users can easily navigate themselves to the primary step which we are willing them to do. It should not be confusing.
  3. Smooth transitions between journey and cart should be more clear with the cost and savings.
  4. An easy start-to-end experience.

#Challenges

  1. We all have a few learnings from a recent team project so we can now apply to it and are ready to face new difficulties.
  2. How to distribute the tasks among us so we can reach the deployment stage before time.
  3. How would we complete the project before time? How to help each other while working on our own stuff?
  4. Merging all pages together and setting up the best user flow.

#Things that we have learned

1. How to figure out the way from which you can reach your milestone with the best output.

2. This time we have applied components so we have used Import/Export to write less code.

3. Still all guys are facing some level of difficulties in GitHub & merging pages. Now we have more learnings on this.

#Conclusion

We think we have achieved the goals that we have decided to. When you go through it you will easily find or search the product that you want, you can add it to the cart, find the totals of Savings and the Payment. Our primary goal was to give the best and easy checkout experience. That we have achieved. Still, there are many things that we could do better if we would have time but in a shorter time span, this is the output that we coded.

--

--