Copilot UX Components: SPFx 1.24 ile Etkileşimli Arayüz
Microsoft, Copilot UX components bileşenlerini SharePoint Framework (SPFx) 1.24 ile genel kullanıma açtı. Pratikte şu değişiyor: Copilot sohbetinde kullanıcıya uzun bir metin yanıtı verip “şu portala gidin” demek yerine, işi tamamlamaya yarayan arayüzü doğrudan konuşmanın içine yerleştirebiliyorsunuz; pano, form, onay ekranı ya da canlı iş verisi görünümü. Bileşenlerin barındırılmasını ve yönlendirilmesini Microsoft 365 tarafı üstleniyor, size iş mantığı ile arayüz kalıyor.
Metin yanıtından tamamlanmış işe
Copilot, kullanıcının ne istediğini doğal dilde anlamakta iyi. Ancak bir iş görevini bitirmek çoğu zaman yazılı yanıttan fazlasını ister: doğru veri, net seçenekler, doğrulama ve değişiklik uygulanmadan önce bir onay adımı. Birden fazla portala ve forma işaret eden yanıt ise kullanıcıyı doğru hedefi bulmak, bağlamı oraya taşımak ve işi başka yerde bitirmekle baş başa bırakıyor. Kurum genelinde sık tekrarlanan rutin süreçlerde bu el değiştirmelerin her biri ek sürtünme demek.
Copilot UX components bu adımı talebin geçtiği yere taşıyor. Kaynaktaki örnekler şöyle: Biri çeyreğin nasıl gittiğini sorduğunda satış panosu sohbette açılabiliyor, kullanıcı filtrelerle rakamları inceleyebiliyor. Bir izin talebinde çalışanın izin bakiyesi, önerilen tarihler ve gönderme düğmesi aynı ekranda gösterilebiliyor. Kullanıcı talebin bağlamından kopmadan detayları gözden geçiriyor, bir sonraki adımı atıyor.
Inline ve tam ekran: arayüzü siz belirliyorsunuz
Copilot UX component, ajanın kullanıcı niyetine göre ihtiyaç duyduğu anda Copilot kanvasında görünen etkileşimli bir web deneyimi. Sabit bir kart şablonuna sıkışmıyorsunuz, arayüzü sürecin kendisine göre şekillendiriyorsunuz. İki görüntüleme modu var:
- Inline: sohbetin içinde hızlı, bağlamsal etkileşimler için.
- Tam ekran: panolar, çok adımlı formlar, haritalar ve ayrıntılı görünümler gibi daha fazla alan isteyen senaryolar için.
Her bileşenin hangi modları desteklediğine ve her modda ne göstereceğine siz karar veriyorsunuz. Bileşenler Copilot’taki açık ve koyu temalara da uyum sağlayabiliyor. Teknoloji tarafında kısıt dar değil: React veya JavaScript ile yazılmış bileşenler kullanılabiliyor. Grafikler, tablolar, haritalar, sihirbazlar, kendi tasarım sisteminiz, tercih ettiğiniz kütüphaneler.
Yapay zeka, kod ve kullanıcı arasındaki iş bölümü
Model, yapay zekanın, uygulama kodunun ve insan kararının güçlü yönlerini ayırıyor:
- Copilot talebi yorumlar ve uygun bileşeni getirir.
- Bileşen; iş verisini, seçenekleri, doğrulamayı ve işlemleri sizin kodunuz ile bağlı sistemler üzerinden sunar.
- İnceleme ve onay adımlarını sizin kodunuz tanımlar. Sonuç doğuran işlemlerde bileşeni, değişiklikler API’ler aracılığıyla iş sistemine gönderilmeden önce kullanıcının gözden geçirip onaylayabileceği şekilde tasarlamanız bekleniyor.
Mevcut süreçleri Copilot içine taşımak
Kurumlardaki birçok süreç halihazırda portallarda, formlarda, panolarda ve iş uygulamalarında yaşıyor. Copilot UX components bu süreçlerin ilgili kısmını Copilot’a taşımak için bir yol açıyor: Kullanıcı doğal dille başlıyor, kurumun sistemlerine dayanan bir arayüzle çalışıyor, görevi kanvasta tamamlıyor. Kaynakta sıralanan senaryo başlıkları şöyle:
- İş kolu verisi: satış panoları, müşteri 360 görünümleri, stok seviyeleri, masraflar ve bordro belgeleri.
- Çalışan hizmetleri: izin, yardım masası, seyahat rezervasyonu, işe alım görevleri ve takdir süreçleri.
- Kişisel panolar: ilgili haberler, son görevler ve günün özeti.
- Yönetişim ve operasyon: site sağlama, politika kontrolleri ve site panoları, her adımı bir yöneticinin onaylamasıyla.
Microsoft’un vurguladığı nokta, mevcut yatırımların atılmasının gerekmediği. Var olan iş mantığı, API’ler ve web geliştirme becerileri Copilot içindeki yeni deneyimleri besleyebiliyor. İş ortakları da tekrar eden müşteri senaryolarını her kurulumda yeniden inşa etmek yerine paketlenmiş çözümlere dönüştürebiliyor. Kaynağa göre müşteri ve iş ortaklarının geliştirdiği SPFx çözümleri, dünya genelinde on binlerce kurumda her gün on milyonlarca son kullanıcıya hizmet veriyor.
MCP Apps modeli, tanıdık araçlar
Bileşenler, yapay zeka deneyimlerinde etkileşimli arayüz için Model Context Protocol (MCP) Apps modelini uyguluyor. Yani açık ve birlikte çalışabilir bir temel var, ama genellikle bununla birlikte gelen barındırma ve yönlendirme işi size kalmıyor.
- Bildiğiniz web yığını: React, TypeScript ve standart JavaScript kütüphaneleri çalışıyor; ekibinizin tercih ettiği framework de kullanılabiliyor. Örneklerin çoğunda React geçiyor ama zorunlu değil.
- Tanıdık araçlar: Minimal, No framework veya React başlangıç şablonları, npm, tercih ettiğiniz editör ve yerel hata ayıklama için Copilot Workbench. Workbench; inline ve tam ekran modlarını, açık/koyu temaları ve farklı giriş özelliklerini test etmeye olanak tanıyor.
- Tek çözüm, çok bileşen: Tek bir SPFx çözümü, ajanı ve bileşenlerini birlikte paketliyor.
Proje yapısı tanıdık bir React/JavaScript düzeninde olduğu için kodlama asistanlarıyla iskelet oluşturma, derleme, yeniden düzenleme ve sorun giderme de mümkün. Yine de deneyimin ve uyguladığı iş davranışının sorumluluğu geliştiricide kalıyor.
Dağıtım müşteri tenant’ı içinde
Arayüz kadar dağıtım modeli de önemli; buradaki amaç ek barındırma ve kimlik işini azaltmak. SPFx, ajanı ve bileşenleri müşterinin Microsoft 365 tenant’ında dağıtılacak şekilde paketliyor:
- Otomatik bileşen barındırma: Çözüm paketi dağıtıldıktan sonra platform, bileşenin JavaScript ve CSS dosyalarını tenant içinde barındırıyor. Ayrı bir web sunucusu kurmanız gerekmiyor.
- Otomatik yönlendirme: Bileşenleriniz Copilot için kaydediliyor, onları kullanan ajan tenant’ta erişilebilir hale geliyor. Sohbet bir bileşeni gerektirdiğinde Copilot onu kanvasta işliyor; dışa açılacak veya birbirine bağlanacak uç nokta yok.
- Yerleşik güvenlik ve SSO: Bileşenler, oturum açmış kullanıcının kimliği ve izinleriyle çalışıyor. Ek oturum açma istemi yok; erişim, kullanıcının zaten sahip olduğu izinleri izliyor.
- Tanıdık yönetişim: SPFx dağıtım ve yönetişim modeli geçerli, ayrı bir dış bileşen barındırma servisi yok. Bağlı iş API’leri için izinler ve onaylar çözümünüzün yapılandırmasının parçası olmaya devam ediyor.
- Daha az altyapı parçası: Ayrı bir barındırma servisi ve dışarıya açık bileşen uç noktası olmadığı için inceleme, çözümün kendisine ve kullandığı iş API’lerine odaklanabiliyor.
Dışarıda barındırılan MCP App ile karşılaştırma
Her iki yaklaşım da etkileşimli arayüz için MCP Apps modelini kullanıyor. Fark operasyonel yükte:
| Konu | Dışarıda barındırılan MCP App | Copilot UX components |
|---|---|---|
| Barındırma | Azure’da veya başka bir bulutta web uygulamasını ve uç noktayı siz kurar, dağıtır ve ölçeklendirirsiniz | Otomatik; müşterinin Microsoft 365 tenant’ı içinde |
| Araç yönlendirme | Uç noktayı siz açar, güvenliğini ve bakımını siz üstlenirsiniz | Otomatik; bileşenler sizin için kaydedilir ve yönlendirilir |
| Kimlik ve SSO | Kimlik doğrulamayı siz uygular ve sürdürürsünüz | Oturum açmış kullanıcının izinleriyle yerleşik SSO |
| Tenant onayı | İncelenip onaylanacak yeni bir dış uygulama veya servis | Mevcut SPFx yönetişimi; bağlı API’ler ek izin veya onay gerektirebilir |
| Operasyon | Yama, izleme, ölçekleme ve kesintisizlik sizde | İşletilecek ayrı bir bileşen barındırma altyapısı yok |
| Veri | İstekler sizin barındırdığınız servisten geçer | Bileşen varlıkları Microsoft 365’te barındırılır; bağlı veri kaynakları çözüm mimarinizin parçası kalır |
| Çok tenant’a ulaşma | Çok kiracılı altyapı ya da müşteri başına dağıtım | Tek paket, istediğiniz sayıda tenant’a dağıtım |
Tek paketi yeniden kullanmak
Aynı SPFx çözüm paketi geliştirme, test ve üretim ortamları arasında taşınabiliyor, her seferinde ayrı bir barındırma ortamı kurmak gerekmiyor. İş ortakları ve ISV’ler bir çözümü birden fazla müşteri için paketleyebiliyor; her dağıtım ilgili müşterinin tenant’ında, onun yönetişimi altında çalışıyor. Genel kullanım aşamasında Copilot UX components, SharePoint Store üzerinden sunulan SPFx çözümlerinde de destekleniyor.
Aynı web kodu Copilot dışındaki yüzeylerde de kullanılabiliyor: Microsoft Copilot’ta inline veya tam ekran bileşen olarak, SharePoint’te sayfa ve portallarda web part olarak, Microsoft Teams’te sekme olarak, Outlook’ta sol gezinmeden açılan ve tam sayfa görünen uygulama olarak.
Genel kullanımda neler var, sırada ne var
Copilot UX components, SPFx 1.24 ile dünya genelinde genel kullanıma açıldı. Kaynakta belirtilen koşullar şunlar:
- Kullanıcıların Copilot içinde bu bileşenleri kullanabilmesi için Microsoft Copilot eklenti lisansı gerekiyor. Lisansı olmayan kullanıcılarda bileşen işlenmiyor, bunun yerine lisans gereksinimini açıklayan bir mesaj görünüyor.
- Copilot UX components kullanımı tek başına tüketim tabanlı ücret doğurmuyor. Ancak bileşen, Work IQ gibi tüketim tabanlı bir API’yi çağırıyorsa o API’ye ait ücretler geçerli olabiliyor.
- Desteklenen istemciler: tarayıcı ve masaüstündeki Microsoft Copilot. Bileşenler, Microsoft Teams üzerinden Copilot kullanıldığında da (tarayıcı ve masaüstü) çalışıyor.
- Paketleme: bildirimsel ajan (declarative agent) ve Copilot UX bileşenleri tek bir SPFx çözümünde birlikte dağıtılıyor.
Planlanan sonraki adımlar arasında Android ve iOS için mobil destek; ajanların ve bileşenlerin yeni Copilot eklenti modeliyle paketlenmesi (bu sayede bileşenler, kurumun yapılandırmasına bağlı olarak belirli bir ajana geçmeden standart Copilot sohbetinde görünebilecek); ayrıca Cowork ve ek Copilot yüzeylerinin desteklenmesi yer alıyor. SPFx 1.25 için planlanan dönem Aralık 2026 veya Ocak 2027 olarak belirtiliyor.
SPFx 1.24’te değişenler
SPFx 1.24, Copilot UX bileşenlerini üretim kullanımına hazır hale getirmenin yanında geliştirme platformunu da güncelliyor:
- Copilot kanvasında öngörülebilir bir varsayılan görüntüleme modu, otomatik Teams manifest sürüm güncellemeleri (bileşen güncellenirken sürüm çakışması yaşanmıyor), derleme sırasında bildirimsel ajan manifest doğrulaması ve yeni bileşenlerin declarative agent manifest v1.8 ile oluşturulması.
- React 18: yeni SPFx çözümleri doğrudan React 18.x ile geliyor.
- Node.js 24 ve Node.js 26: ikisi de SPFx geliştirmede destekleniyor.
- Önizleme geri bildirimlerine dayanan düzeltmeler ve npm audit bulgularına yönelik güncellemeler.
Önizleme sürümleri üzerine bir şey geliştirdiyseniz GA sürümüne güncellemeniz öneriliyor. Mevcut çözümleri React 18’e taşıyorsanız test etmeniz, yükseltme yolları ile üçüncü taraf kütüphane değerlendirmeleri için React 18 yükseltme rehberine bakmanız isteniyor. Ayrıntılar SPFx 1.24 sürüm notlarında.
Nasıl başlanır
Önerilen başlangıç, kendi tenant’ınızda dağıtıma hazır bir senaryo örneğini denemek. Örnekler çözüm paketleri, demo veri ve kurulum adımlarıyla geliyor; kendi bileşeninizi yazmadan önce etkileşimli bir deneyimin Copilot içinde nasıl çalıştığını görebiliyorsunuz. Kendi bileşeninizi dört adımda oluşturabilirsiniz:
- SPFx 1.24’ü kurun:
npm install @microsoft/generator-sharepoint@latest --global - Yeni bir Copilot UX component iskeleti oluşturun ve şablonu seçin: Minimal, No framework veya React.
- Copilot Workbench içinde yerel olarak çalıştırıp test edin.
- Paketi tenant’ınıza dağıtın ve Copilot’ta yüzeye çıkarın.
Nereden başlayacağınıza karar veremiyorsanız iyi bir yöntem var: Kullanıcıların Copilot’a sorduğu ama hala başka bir portalda bitirmek zorunda kaldıkları tek bir görev seçin. İzin talebi, masraf onayı ya da satış rakamlarına hızlı bir bakış olabilir. Veriyi ve eylemi doğrudan sohbette, gözden geçirilip onaylanabilir biçimde sunun.
Son bir not: Daha eski belgelerde bu yetenek SharePoint Copilot Apps veya Copilot Components adlarıyla geçiyor olabilir; güncel adı Copilot UX components.
Kaynaklar ve İleri Okuma
- devblogs.microsoft.com
- devblogs.microsoft.com
- devblogs.microsoft.com
- devblogs.microsoft.com
- aka.ms
- devblogs.microsoft.com
- devblogs.microsoft.com
- devblogs.microsoft.com
- Copilot UX components are generally available: bring interactive experiences into Copilot — Microsoft 365 Developer Blog (Vesa Juvonen)
- Copilot UX components ile başlangıç sayfası
- Copilot UX components dokümantasyonu
- Örnek çözüm galerisi
- İlk Copilot UX bileşenini oluşturma videosu
- Copilot UX components: Copilot’ta sohbete gömülü arayüz
- Azure Functions Managed Connectors ile SharePoint ve Teams
20+ yıl deneyimli Azure Solutions Architect. Microsoft sertifikalı bulut mimari ve DevOps danışmanı. Azure, yapay zekâ ve bulut teknolojileri üzerine Türkçe teknik içerikler üretiyor.
Yorum gönder