There are tones of ways to do that... but only if you want to follow the flow exactly same as on your example website.
The most important thing is that example you gave adds products as individual products. So the trick here - is to make user think that it is single product page, but in fact you need to group products and output them like they are one single item. But all these options - are 4 different products in Magento. And they are NOT inside bundle. It is quite "nice and easy" flow that does not brake Magento-way functionality :)
In order to do that - just group products, for example by some Custom Attribute field, by special SKU tempate (e.g. SKU-GROUP-1, SKU-GROUP-2, etc), set them as related or etc etc etc. Than on BE somewhere after product load - try to load these additional products and save inside "main" one. Than just style output like given example website did - so they seem to be one single product page.
That worked like a charm in my case and works pretty fast. Check it out:
https://www.conranshop.co.uk/home-accessories/bedroom-linen/citrine-bed-linen-collection.html
EDIT:
M1 logic:
Create new Product Attribute called "Linked SKUs" (linkedSKU) - text field (varchar).
Add observer for frontend action: catalog_product_load_after. Inside this action check "linkedSKU" attribute value that will be "comma-separated-SKUs" e.g. "SKU1,SKU2,SKU3". Load each product by SKU and save inside main product object.
E.g.
$productIDs = explode(',',$product->getLinkedSKU());
foreach($productIDs as $pid) $productsLoaded[] = Mage::getModel('cat/prod')->load($pid);
$product->setLinkedSkuProducts($productsLoaded);
- On FE on product view phtml - if there is anything inside
$product->getLinkedSkuProducts()
and than just output each product as tyled block.
So in admin you can set for "Main Product" attribute with list of SKUs that will be loaded under this main object.