Shopify AR drivs av 3 d正式e

Shopify AR låter kunder som använder webbläsaren Safari på iOS 12-enheter se realistiska och interaktiva versioner av dina produkter i Augmented Reality (förstärkt verklighet, AR). Med AR kan du ge dina kunder en bättre känsla av storlek, omfattning och detaljer för dina produkter. Appen 3D Warehouse gör det möjligt för dig att ladda upp 3D-modeller och länka dem till produkter i din butik.

Visa en vas i 3D

Om du vill att kunder ska kunna se dina produkter i AR,Installera 3D Warehouse-appen,skaffa 3D-modeller av dina produkter,lägg till 3D-modellerna till appen,redigera ditt tema för att aktivera AR Quick Look, och lägg sedan tillAR-märket till dina 3D-produkter.

Steg 1: Installera 3D Warehouse-appen

Steg 2: få 3D-modeller av dina produkter

Innan kunder kan se dina produkter i AR behöver du 3D-modeller av dina produkter. 3D-modeller är virtuella representationer av ett föremål eller en yta i tre dimensioner. De låter dig se föremålet från vilken vinkel som helst.

Du kan anlita en Shopify-expert för att få hjälp med att skapa 3D-modeller av dina produkter. I Shopify Experts Marketplace kan du bläddra bland experter som erbjuder tjänsten attskapa 3D-modeller, välja en expert och kontakta dem.

Med hjälp av kontaktformuläret för experter ger du information om ditt projekt. Se till att följa de länkade riktlinjerna om du vill delaproduktbilderochproduktdimensionernu.

När du kontaktar en expert förbinder du dig inte att anlita en Shopify-expert. Det här steget innebär endast att en förfrågan skickas till experten som sedan kan granska din förfrågan. Om en expert beslutar sig för att arbeta med dig kommer de att kontakta dig med mer information om kostnader och hur ni kan börja arbeta tillsammans.

Om du inte har tillhandahållitproduktbilderochproduktmåttredan som en del av din jobbförfrågan kommer experten fråga om det. Följ nedanstående specifikationer när du tar foton och mätningar.

Produktbilder

3D-modeller skapas med hjälp av bilder. För att skapa 3D-modellen behöver Shopify-experten bilder av dina produkter från flera vinklar:

Produktbildsvinklar

Följ dessa riktlinjer när du tar bilder av din produkt:

  • Se till att din produkt är väl upplyst.
  • Se till att hela din produkt är i fokus.
  • Använd helst inte en mobilkamera om det går att undvika. Använd en kamera med ett 50 mm objektiv för stora produkter såsom möbler. Använd ett 70 mm eller 100 mm objektiv för små eller medelstora produkter.
  • Ta extra bilder av några unika detaljer eller strukturer.
  • Ge bildfilerna tydliga titlar somblue vase - topellerblue vase - leftoch spara dem i en mapp med tydligt namn.

Produktmått

För att skapa exakta 3D-modeller behöver Shopify-expert detaljerade mått av din produkt. Följ dessa riktlinjer när du ger experten måtten:

  • Beskriv varje维度avdin produkt i tydliga, enkla ord.
  • Ange måtten imm.
  • Använd ett diagram för att visa vilka dimensioner måtten motsvarar.
  • Om du har tekniska ritningar eller CAD-filer kopplade till din produkt bör du ta med dessa också.

Exempel på att få 3D-modeller gjorda

Naomi säljer den här blå vasen:

Vas

Hon installerar appen 3D Warehouse, använder sedan Experts Marketplace för attanlita en Shopify-expertför att skapa en 3D-modell av vasen. Naomi skickar sex högkvalitativa foton tagna med en kamera med ett 70 mm objektiv till experten:

Produktfotovinklar

Naomi ger experten ett måttdiagram med motsvarande produktmått i millimeter:

Vas

  • Vasens (1) höjd är ____mm
  • Den övre delen av vasen till botten av halsen (2) är ____mm
  • Botten på halsen till botten av vasen (3) är ____mm
  • Diametern på vasens öppning (4) är ____ mm
  • Bredden på kanten av öppningen (5) är ____mm
  • Diametern på botten av halsen (6) är ____ mm
  • Det finns 8 sexkantiga ytor på vasen
  • Höjden på de sexkantiga ytorna (8) är ____mm
  • Bredden på de sexkantiga ytorna (9) är ____mm
  • Diametern för vasens bredaste del (10) är ____ mm
  • Vasens botten (11) har en diameter på ____ mm
  • Diametern på skumfötterna är ____mm

Shopify-experten använder dessa foton och mått för att skapa en 3D-modell av den blå vasen. Experten skickar en.glboch en.usdz-fil Naomi som honlägger till i 3D Warehouse-appen.

Steg 3: Kontrollera modellens kvalitet

När en Shopify-expert tillhandahåller en 3D-modell bör du kontrollera att du är nöjd med kvaliteten. Experten bör ge dig anvisningar för hur du förhandsgranskar modellen.

Kontrollera modellen från alla vinklar. Du kan användaGlTF Viewerför att förhandsgranska dina 3D-modeller. Överväg att följande frågor när du granskar din modell:

  • Matchar modellens form referensbilderna för produkten som du skickade till experten?
  • Är alla delar av modellen proportionella jämfört med resten?
  • Om du菅直人forhandsgranska modellen i augmented reality ser då modellens storlek korrekt ut jämfört med resten av miljön?
  • Ser modellen ut som den är gjord av samma material som produkten?
  • Ser modellens material utsträckt, suddigt eller förvrängt ut?
  • Finns det några detaljer som små nötningar eller repor som få modellens material att kännas mer realistiskt?
  • Om delar av produkten är transparenta, reflekterande eller avger ljus, ser de delarna då rätt ut?
  • Ser alla kanter realistiska ut? Är någon av dem för skarp och behöver mjukas upp?
  • Om det finns några dekorativa detaljer, till exempel en logotyp eller lite text, är de lätta att se?
  • Finns det några luckor eller hål där det inte borde finnas några?
  • Uppfyller 3D-modellen de tekniska kraven för Shopify-plattformen?
    • 3D-modellen måste vara en GLB-fil.
    • GLB-filen bör vara ungefär 4 MB.
    • GLB-filen för inte överskrida 15 MB.

Shopify-expert ska bygga 3D-modellen enligt vissa standards. SeSkapa 3D-modeller för handlareom du vill veta mer om standarder för 3D-modeller så att du bättre kan granska en modell.

Kontakta Shopify-experten och förklara vad som är fel med modellen om du inte tycker att kvaliteten är tillräckligt bra.

Steg 4: Lägg till en 3D-modell till 3D Warehouse-appen

När du har installerat appen 3D Warehouse och har hämtat en 3D-modell måste du lägga till modellen i 3D Warehouse-appen.

Steg:

  1. Klicka påInställningar>Appar och försäljningskanalerfrån din Shopify-admin.

  2. På sidanAppar och försäljningskanalerklickar du på3D Warehouse.

  3. Klicka påÖppna app.

  4. Klicka påLägg till 3D-modell.

  5. Ange en-namn för 3D-modellen i fältetrubrik.

  6. I fältetlänkad produktväljer du den produkt och variant som den här 3D-modellen är kopplad till och klickar sedan påVälj produkt.

  7. Klicka påLadda upp filoch välj den.usdz-fil som tillhandahålls av Shopify-experten.

  8. Klicka påSpara.

Upprepa uppladdningsprocessen för.gltfeller.glb-filen som din Shopify-expert har tillhandahållit. Se till att du länkar den till samma produkt så att du har båda 3D-modellfiltyperna som är kopplade till produkten.

Godkända filtyper

Shopify-experter tillhandahåller två olika filtyper för varje 3D-modell, en.usdz-fil och en.gltfeller.glb-fil. De olika filtyperna används av olika plattformar och funktioner. Om du till exempel vill att kunder ska kunna se 3D-produkter i webbläsaren Safari på iOS 12-enheter måste du ladda upp en.usdz-fil. Det bästa sättet att se till att din webbutik är kompatibel med framtida förstärkt verklighet och 3D-funktioner är att ladda uppbådafiltyperna.

Steg 5: redigera ditt tema för att aktivera AR Quick Look

Du måste redigera din temakod för att aktivera AR Quick look, som är den funktion som låter kunder som använder webbläsaren Safari på iOS 12-enheter se dina 3D-produkter.

Steg:

  1. Klicka påInställningar>Appar och försäljningskanalerfrån din Shopify-admin.

  2. På sidanAppar och försäljningskanalerklickar du på欧宝体育官网入口首页.

  3. Klicka påÖppna försäljningskanal.

  4. Klicka påÅtgärder>Redigera kodintill det aktuella temat.

  5. Ilayoutmappenklickar du på{/} theme.liquid.

  6. Hitta-taggen. Den bör vara nästan längst upp i filen.

  7. På nästa rad klistrar du in följande kod:

  1. Klicka påSpara.
  2. I mappenavsnitt, klicka på{/} product-template.liquid.
  3. Lägg till följande kod högst upp i filen:
![Quicklook library added to product template](/manual/apps/3d-warehouse/quicklook-product-template.png)
  1. Klicka påSpara.

Om du använder mer än en produktmall, lägg till koden till dessa mallfiler också.

Steg 6: Lägg till AR-märke till dina 3D-produkter

Kunder som använder iOS 12-enheter vet att de kan se din produkt i 3D när de ser överlägget i AR-märket:

Överlagring av AR-märke

Du måste redigera din temakod för att visa AR-märket på produktbilder.

Steg:

  1. Klicka påInställningar>Appar och försäljningskanalerfrån din Shopify-admin.

  2. På sidanAppar och försäljningskanalerklickar du på欧宝体育官网入口首页.

  3. Klicka påÖppna försäljningskanal.

  4. Klicka påÅtgärder>Redigera kodintill det aktuella temat.

  5. I mappenavsnitt, klicka på{/} product-template.liquid.

  6. Hitta avsnittet i den mall som är kopplad till ditt produktfoto. Leta efter sökord såsomProductPhotoellerfeatured_image:

    Product photo liquid

  7. I avsnittet produktfoto hittar du den första-taggen.

  8. På raden ovanför den taggen klistrar du in följande kod:

{{product.selected_or_first_available_variant.id}}" style="display: none;">
![Product photo liquid with code](/manual/apps/3d-warehouse/product-image-liquid-with-code.png)
  1. Klicka påSpara.
  2. Öppna den fil som innehåller ditt temas CSS. Den här filen finns vanligtvis i mappentillgångar, och oftast har den ett namn som{/}theme.scss.liquid.
  3. Längst ner i filen lägger du till följande kod:
.ar-quicklook-overlay{position:absolute;width:100%;height:100%;top:0;z-index:2;}
  1. Klicka påSpara.

Om du vill prova din 3D-modell öppnar du din webbutik i webbläsaren Safari på en iOS-enhet som kör iOS 12 och navigerar sedan till produktsidan. Tryck på AR-märket i produktbilden för att visa det i 3D.

Är du redo att börja sälja med Shopify?

Prova gratis