When you edit the file "show" of the view "product" via the menu Display->Views it's basically just a matter of swapping the different blocks of HTML code so that you move around the different blocks.
There are 4 blocks on the product page:
top, left, right, bottom. If you move something from the top (like the name) to the right, then it will display on the right of the page.
Regarding the HTML, that's all we did in that view on the demo website.
All the rest was done with CSS. You can see all the CSS we added for that page in that CSS file if you search for hikashop_product_Graphic_tablet_page_perso.
There is quite a lot of it but the modifications are quite substential as well.
The kind of customization if fairly advanced so there is no tutorial for that for now.