Skip to main content

arfit_sdk 1.0.2 copy "arfit_sdk: ^1.0.2" to clipboard
arfit_sdk: ^1.0.2 copied to clipboard

ARFit SDK - Augmented Reality shopping experience for mobile and web. Flutter ve Web entegrasyonu ile 3 satırda AR deneyimi ekleyin!

ARFit SDK 🛒📱 #

Flutter uygulamanıza 3 satırda Augmented Reality (AR) alışveriş deneyimi ekleyin!

pub package License: MIT


✨ Özellikler #

  • ✅ Kolay Entegrasyon - Mevcut ürün ID'lerinizi kullanın
  • ✅ Otomatik Analitik - Kullanıcı davranışları otomatik takip edilir
  • ✅ Özelleştirilebilir - Buton tasarımını dilediğiniz gibi değiştirin
  • ✅ Web & Mobil Desteği - Tüm platformlarda çalışır
  • ✅ Sıfır Konfigürasyon - 3D modeller ARFit tarafından sağlanır

📦 Kurulum #

Flutter Uygulamaları İçin #

pubspec.yaml dosyanıza ekleyin:

dependencies:
  arfit_sdk: ^1.0.0

Terminalde çalıştırın:

flutter pub get

Web Siteleri İçin #

HTML sayfanıza ekleyin:

<script src="https://pub-827d9f89399f4d8e81df052ffe4b21ba.r2.dev/arfit-widget.js"></script>
<script>
  ARFit.show({
    productId: 'urun-12345',
    modelUrl: 'https://...',
    productName: 'Ürün Adı',
    apiKey: 'your_api_key'
  });
</script>

🚀 Kullanım (3 Adım) #

1️⃣ SDK'yı Başlatın #

Ana main.dart dosyanızda bir kez başlatın:

import 'package:flutter/material.dart';
import 'package:arfit_sdk/arfit_sdk.dart';

void main() {
  ARFitAnalytics().initialize(
    apiUrl: 'https://arfit-api.arfitcompany.workers.dev',
  );
  
  runApp(MyApp());
}

2️⃣ Ürün ID'lerinizi ARFit'e Gönderin #

ARFit ekibine mevcut ürün ID'lerinizi ve ürün bilgilerinizi gönderin:

📧 Email: info@arfit.dev

Konu: Yeni Ürün AR Entegrasyonu

Ürün Bilgileri:
- Ürün ID: urun-8308622
- Ürün Adı: Eliptik Bisiklet Pro
- Kategori: Cardio
- Fiyat: 8999 TL
- Görseller: [ürün-görselleri.zip]

ARFit ekibi:

  1. Ürünü 3D olarak tarar
  2. Sisteme yükler
  3. Sizin ID'nizi kullanarak kaydeder
  4. Size "Hazır!" mesajı gönderir

3️⃣ Kendi Ürün ID'nizi Kullanın #

Ürün sayfanıza AR butonu ekleyin - kendi ID'nizi kullanın:

ARFitButton(
  productId: 'urun-8308622',  // ← SİZİN ürün ID'niz
  productName: 'Eliptik Bisiklet Pro',
  modelUrl: '',  // ← Boş bırakın, otomatik çekilir
)

Hepsi bu kadar! 🎉


🌐 Web Sitesi Entegrasyonu #

HTML/JavaScript İçin #

1. Script'i ekleyin:

<!DOCTYPE html>
<html>
<head>
  <title>Ürün Sayfası</title>
</head>
<body>
  <h1>Samsung TV 55"</h1>
  <p>Fiyat: 45.999 TL</p>

  <!-- ARFit Widget SDK -->
  <script src="https://pub-827d9f89399f4d8e81df052ffe4b21ba.r2.dev/arfit-widget.js"></script>
  <script>
    ARFit.show({
      productId: 'urun-tv-55',
      modelUrl: 'https://your-cdn.com/models/tv.glb',
      modelUrlIos: 'https://your-cdn.com/models/tv.usdz',
      productName: 'Samsung TV 55"',
      apiKey: 'your_api_key_here',
      bubbleText: 'Evinde AR ile gör 👆',
      primaryColor: '#0082C3'
    });
  </script>
</body>
</html>

2 saniye sonra sağ altta AR baloncuğu çıkar!

WordPress İçin #

Theme Functions.php:

function add_arfit_widget() {
  if (is_product()) {
    global $product;
    ?>
    <script src="https://pub-827d9f89399f4d8e81df052ffe4b21ba.r2.dev/arfit-widget.js"></script>
    <script>
      ARFit.show({
        productId: '<?php echo $product->get_id(); ?>',
        productName: '<?php echo $product->get_name(); ?>',
        apiKey: 'your_api_key'
      });
    </script>
    <?php
  }
}
add_action('wp_footer', 'add_arfit_widget');

Shopify İçin #

Theme Liquid:

{% if product %}
<script src="https://pub-827d9f89399f4d8e81df052ffe4b21ba.r2.dev/arfit-widget.js"></script>
<script>
  ARFit.show({
    productId: '{{ product.id }}',
    productName: '{{ product.title }}',
    apiKey: 'your_api_key'
  });
</script>
{% endif %}

💡 Nasıl Çalışır? #

1. Kullanıcı AR butonuna tıklar veya baloncuğu görür
   ↓
2. SDK sizin ürün ID'nizi gönderir: "urun-8308622"
   ↓
3. ARFit sunucusu bu ID için 3D modeli bulur
   ↓
4. AR görüntüleyici açılır ve modeli gösterir

Siz sadece mevcut ürün ID'lerinizi kullanırsınız!


🎨 Özelleştirme #

Flutter - Buton Stilini Değiştirin #

ARFitButton(
  productId: 'urun-12345',  // Kendi ID'niz
  productName: 'Koşu Bandı X200',
  modelUrl: '',
  buttonText: 'AR ile İncele',
  style: ElevatedButton.styleFrom(
    backgroundColor: Colors.purple,
    padding: EdgeInsets.symmetric(horizontal: 32, vertical: 16),
  ),
)

Flutter - Floating AR Baloncuğu #

Stack(
  children: [
    // Ürün sayfanız...
    
    ARFitFloatingButton(
      productId: 'urun-12345',
      productName: 'Koşu Bandı X200',
      modelUrl: '',
      showDelay: Duration(seconds: 2),
    ),
  ],
)

Web - Baloncuk Özelleştirme #

ARFit.show({
  productId: 'urun-12345',
  modelUrl: 'https://...',
  productName: 'Ürün Adı',
  apiKey: 'your_api_key',
  
  // Özelleştirme
  bubbleText: 'AR ile dene! 🔥',
  bubbleDelay: 3000,  // 3 saniye
  position: 'bottom-left',  // veya top-right, top-left, bottom-right
  primaryColor: '#FF0000'  // Kırmızı
});

📊 Analitik Dashboard #

Tüm kullanım istatistiklerinizi görüntüleyin:

👉 Dashboard'a Git

  • Hangi ürünler daha çok AR ile görüntüleniyor
  • AR kullanımı sepet dönüşümünü ne kadar artırıyor
  • Kullanıcı davranış analitiği
  • Platform dağılımı (iOS, Android, Web)
  • Gerçek zamanlı aktivite akışı

💼 Örnek Entegrasyon #

Flutter - E-Ticaret Ürün Listesi #

class ProductCard extends StatelessWidget {
  final Product product;
  
  @override
  Widget build(BuildContext context) {
    return Card(
      child: Column(
        children: [
          Image.network(product.imageUrl),
          Text(product.name),
          Text('${product.price} ₺'),
          
          // AR butonu - Kendi ürün ID'nizi kullanın
          ARFitButton(
            productId: product.id,  // ← Kendi veritabanınızdaki ID
            productName: product.name,
            modelUrl: '',
          ),
          
          AddToCartButton(product: product),
        ],
      ),
    );
  }
}

Flutter - Ürün Detay Sayfası #

Scaffold(
  body: SingleChildScrollView(
    child: Column(
      children: [
        ProductImageGallery(product: product),
        ProductInfo(product: product),
        
        // AR butonu
        Padding(
          padding: EdgeInsets.all(16),
          child: ARFitButton(
            productId: product.id,  // ← Mevcut ID sisteminiz
            productName: product.name,
            modelUrl: '',
          ),
        ),
        
        ProductDescription(product: product),
        AddToCartButton(product: product),
      ],
    ),
  ),
)

Web - React Entegrasyonu #

import { useEffect } from 'react';

function ProductPage({ product }) {
  useEffect(() => {
    // ARFit Widget yükle
    const script = document.createElement('script');
    script.src = 'https://pub-827d9f89399f4d8e81df052ffe4b21ba.r2.dev/arfit-widget.js';
    script.onload = () => {
      window.ARFit.show({
        productId: product.id,
        productName: product.name,
        apiKey: process.env.REACT_APP_ARFIT_API_KEY
      });
    };
    document.body.appendChild(script);
    
    return () => document.body.removeChild(script);
  }, [product]);

  return (
    <div>
      <h1>{product.name}</h1>
      <p>{product.price} ₺</p>
      {/* AR baloncuğu otomatik çıkacak */}
    </div>
  );
}

🆕 Yeni Ürün Ekleme Süreci #

  1. Email Atın: info@arfit.dev
  2. Ürün Bilgilerini Gönderin:
    • Ürün ID (sizin sisteminizdeki)
    • Ürün adı
    • Görseller (farklı açılardan)
    • Ölçüler (varsa)
  3. Bekleyin: ARFit ekibi 3D modelini oluşturur (2-5 gün)
  4. Onay Alın: "Ürün hazır!" mesajı gelir
  5. Kullanın: Kodunuza sadece kendi ID'nizi ekleyin

3D tarama ve model oluşturma tamamen ARFit sorumluluğundadır!


🔑 API Key Alma #

Web entegrasyonu için API Key gereklidir:

  1. Email gönderin: info@arfit.dev
  2. Şirket bilgilerinizi paylaşın
  3. API Key alın: company_xxxxxxxxxxxxx
  4. Kodunuzda kullanın

Flutter SDK için API Key opsiyoneldir (analytics için önerilir).


❓ Sıkça Sorulan Sorular #

Mevcut ürün ID sistemimizi değiştirmemiz gerekir mi? #

Hayır! Kendi ID sisteminizi kullanmaya devam edin. ARFit, sizin ID'lerinizi kullanarak 3D modelleri eşleştirir.

Her ürün için AR desteği eklemeli miyiz? #

Hayır, sadece AR ile gösterilmesini istediğiniz ürünler için ARFit SDK'yı kullanın. Diğer ürünler normal çalışmaya devam eder.

3D model güncellenirse ne olur? #

ARFit tarafında güncellenir, sizin kodunuzda hiçbir değişiklik gerekmez. Kullanıcılar otomatik olarak yeni modeli görür.

Web ve mobil aynı anda çalışır mı? #

Evet! Aynı API Key ile hem Flutter uygulamanızda hem web sitenizde kullanabilirsiniz. Tüm veriler tek dashboard'da birleşir.

Hangi 3D model formatlarını destekliyorsunuz? #

  • Android/Web: GLB (GLTF Binary)
  • iOS: USDZ (Universal Scene Description)

ARFit otomatik olarak doğru formatı kullanır.


🐛 Sorun Giderme #

Flutter - "SDK not initialized" hatası #

// main.dart'ta initialize() çağrısını kontrol edin
ARFitAnalytics().initialize(
  apiUrl: 'https://arfit-api.arfitcompany.workers.dev',
);

Web - "ARFit is not defined" hatası #

Script yüklenmemiş, URL'i kontrol edin:

<script src="https://pub-827d9f89399f4d8e81df052ffe4b21ba.r2.dev/arfit-widget.js"></script>

"Model bulunamadı" hatası #

  • Ürün ID'sinin doğru olduğundan emin olun
  • ARFit ekibine ürünün sisteme eklendiğini teyit edin
  • Email: info@arfit.dev

Baloncuk çıkmıyor #

  • Console'da hata var mı kontrol edin (F12)
  • bubbleDelay ayarını kontrol edin
  • Script doğru yüklendi mi kontrol edin

📱 Platform Desteği #

Platform Flutter SDK Web Widget Notlar
Android ✅ ✅ ARCore gerektirir
iOS ✅ ✅ ARKit gerektirir
Web ⚠️ ✅ WebXR destekli tarayıcılar
Desktop ❌ ✅ Önizleme modu

🤝 Destek & İletişim #


📄 Lisans #

MIT License

Copyright (c) 2025 ARFit


🎯 Örnek Projeler #

  • Flutter Demo: https://arfit.dev
  • Web Widget Demo: [Yakında]
  • WordPress Plugin: [Yakında]
  • Shopify App: [Yakında]

🙏 Teşekkürler #

ARFit SDK'yı kullandığınız için teşekkürler! ⭐️

Sorunuz mu var? info@arfit.dev

0
likes
145
points
45
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

ARFit SDK - Augmented Reality shopping experience for mobile and web. Flutter ve Web entegrasyonu ile 3 satırda AR deneyimi ekleyin!

Homepage

License

MIT (license)

Dependencies

crypto, flutter, http, webview_flutter

More

Packages that depend on arfit_sdk