Mac mini website - RW recreation

General Web Design
1

There was a good discussion about Blocs 3 on this forum recently and within that was a link to a really nice, Blocs-built, recreation of Apple’s Mac Mini website.

Inspired by that I thought I’d have a go at recreating the recreation using RapidWeaver and Stacks. You can have a look at it here: https://demo.shakingthehabitual.com/projects/mac-mini/

Please note that I have only really focussed on the desktop view (as yet anyway). This should now look pretty decent on all devices!

What you might find surprising is that all of this was created with no framework, no coding, a blank theme (@Jannis’s Void theme) and only 6 of @tav’s BWD stacks.

19 Likes
2

Nicely done - and no parallax :)

3 Likes
3

Very nicely done. You should wrap that up as a self-contained project and sell it.

4 Likes
4

I agree nicely done.

Any chance of sharing the RW doc? (The cheek of the woman!!) @habitualshaker

2 Likes
5

Great job and I bet it took some time to get that working. I posted that original Blocs demo site link and it’s interesting to see a RW blank theme based version.

My original point was that the Blocs demo was created with just the Blocs App that was used without any additional need for a theme and Stacks and Tav’s stacks.

1 Like
6

That’s lovely. Really well executed.

2 Likes
7

Great Job! Does it take a great deal of time to get the mobile version correct?

8

Thanks @Norm .

Will find out this evening! Shouldn’t take too long - an hour maybe - just need to tweak some margins, font sizes and alignment at the lower breakpoints.

1 Like
9

Very nicely done indeed! Would be interesting to know which stacks.

1 Like
10

In no particular order:

  1. Sections Pro
  2. Sections Box
  3. BluePrint SideBar
  4. Header Pro
  5. Paragraph Pro
  6. LimeLight
  7. ScrollMate 2

Oops - it was 7! (I switched out a couple of Sections Pro for Sections Box late on)

Also used the default Stacks Image, HTML and 4 column stacks. (The HTML one was simply to add a horizontal rule <hr> for the 4 animated bars near the top.)

11

I seriously need to get @tav to turn to the darkside ;)

4 Likes
12

Thanks. Seeing fine examples like yours shows me how much I need to learn. all good!

1 Like
13

Great work! :)

I see my little experiment has inspired some other designers to do the same! Maybe somebody will produce a Wordpress version of this soon! :)

4 Likes
14

Thanks @Eldar

Ha! Yep - maybe. There was some chat here too about good Wordpress tools recently so maybe someone will pick up that challenge :)

2 Likes
15

Before this comment you have been very pleasant to me.

😉

6 Likes
16

You will also need Scrollmate or something similar for the missing Nav bar. Very interesting and no surprise that it is Tavs stacks that are needed.

I still don’t think that the demo site in question could be built with RW, Stacks and either Foundation stacks plus add-on packs or Foundry stacks plus all add-on packs.

Edit update: The new Foundry Thunder Pack now has a scroll triggered animation.

1 Like
17

No, without Tav, the Apple website wouldn’t be possible 😃

5 Likes
18

I could tinker with this for an age but am stopping now. It should now look pretty decent on all devices.

Thanks for all your positive comments.

5 Likes
19

Wow… that is something I would love as well !

20

It looks fantastic on my iPhone! And, I make three that would love to download the project file- if you’re so inclined. 😉

2 Likes