Eldar Gezalov

April 12, 2021

Apple.com Mockup in Blocs 4

A couple of years ago, I have recreated Apple's Mac mini website in Blocs 3. I did it for fun, so I was amazed at how much interest this project spurred across my followers and even people who have never heard about Blocs.

Since then, the developers of Blocs have introduced the next version of my favorite web design tool, Blocs 4. So, I thought why not give it another try and rebuild an even more complex page from Apple's website.

Today, I am happy to share with you my new mockup of the Apple.com website. This time, it is a very long graphic and video-heavy website for iPhone 12 Pro.

iphones.png

Not everything on this page is a carbon copy of the original website, but it is quite amazing how much I was able to recreate using Blocs. I didn't do my best to optimize for performance, so if you are one of these people who like to run tests on everything (I do that all the time myself), let me disappoint you - my goal was to archive the closest visual resemblance of the Apple's website. That being said, I have compared the GTMetrix scores of my website to the original, and surprisingly, my version showed a better rating.

The most important things you need to keep in mind are the following:
  • I have rebuilt this website without writing a line of code
  • I have not used any 3rd party plugins (custom brics)
  • Everything on that page is created with a bare-bone version of Blocs 4.

I think it is very impressive!

Learn more about Blocs app

P.S. Obviously, I don't have any rights to sell this as a template, so it's not available for purchase. I am only sharing this project file with Blocs Templates members (only for educational purposes).