การเปลี่ยนผ่านมีประโยชน์หลายประการสำหรับผู้ใช้ เช่น ช่วยให้เข้าใจบริบทและลดการมองข้ามเวลาในการตอบสนอง นักพัฒนาซอฟต์แวร์ต้องการความสามารถในการเปลี่ยนหน้าอย่างราบรื่น ซึ่งช่วยเพิ่มการมีส่วนร่วมของผู้ใช้กับเว็บไซต์ได้
อย่างไรก็ตาม การเปิดใช้การเปลี่ยนสถานะนั้นเป็นเรื่องที่ยากมาก เนื่องจากนักพัฒนาซอฟต์แวร์จำเป็นต้องจัดการสถานะขององค์ประกอบ 2 อย่างที่แตกต่างกัน แม้แต่ฟังก์ชันการเฟดแบบง่ายๆ ก็เกี่ยวข้องกับทั้ง 2 สถานะที่แสดงพร้อมกัน ซึ่งส่งผลให้เกิดความท้าทายด้านความสามารถในการใช้งาน เช่น การจัดการการโต้ตอบเพิ่มเติมในองค์ประกอบขาออก สําหรับผู้ใช้อุปกรณ์อำนวยความสะดวก จะมีช่วงหนึ่งที่สถานะก่อนและหลังอยู่ใน DOM พร้อมกัน นอกจากนี้ สิ่งต่างๆ อาจเคลื่อนที่ไปรอบๆ ต้นไม้ด้วยวิธีที่ดูสวยงาม แต่อาจทำให้ตำแหน่งการอ่านและการโฟกัสหายไปได้ง่าย
View Transitions API ที่เปิดตัวใน Chrome 111 ช่วยให้การเปลี่ยนหน้าเป็นไปอย่างราบรื่นและเรียบง่าย ซึ่งช่วยให้คุณทำการเปลี่ยนแปลง DOM โดยไม่ทับซ้อนกันระหว่างสถานะต่างๆ และช่วยให้มีภาพเคลื่อนไหวการเปลี่ยนระหว่างสถานะโดยใช้มุมมองสแนปชอต
คุณอาจสงสัยว่าคุณนำไปใช้งานได้ง่ายเพียงใด กรณีการใช้งานมีประเภทใดบ้าง นักพัฒนาซอฟต์แวร์รายอื่นๆ ใช้การเปลี่ยนมุมมองอย่างไร
บทความนี้จะอธิบายการใช้งานการเปลี่ยนมุมมองใน 4 เว็บไซต์ต่างๆ ได้แก่ RedBus (ท่องเที่ยว), CyberAgent (ผู้เผยแพร่ข่าว/บล็อก), Nykaa (อีคอมเมิร์ซ) และ PolicyBazaar (ประกันภัย) รวมถึงประโยชน์ที่เว็บไซต์ของตนได้รับในลักษณะต่างๆ โดยใช้ View Transitions API
redBus
ซึ่งเป็นหนึ่งในเว็บไซต์แรกๆ ที่นำประสบการณ์การใช้งาน View Transitions API มาใช้
เหตุใด Redbus จึงใช้การเปลี่ยนมุมมอง
ทีมของ redBus เชื่อมั่นในการมอบประสบการณ์การใช้งานเว็บที่เป็นหนึ่งเดียวเหมือนแอป ซึ่งใกล้เคียงกับแอปที่มาพร้อมเครื่องมากที่สุด ในความเป็นจริง บริษัทได้ใช้โซลูชันที่ปรับแต่งเองหลายโซลูชันในช่วงหลายปีที่ผ่านมา ตัวอย่างเช่น พวกเขาสร้างภาพเคลื่อนไหวที่กำหนดเองโดยใช้ JavaScript และ CSS สำหรับการเปลี่ยนหน้าก่อนที่จะพัฒนา View Transitions API เสียอีก อย่างไรก็ตาม นั่นหมายถึงว่า พวกเขาต้องจัดการกับการจัดการประสิทธิภาพในกลุ่มเครือข่ายและอุปกรณ์ที่ต่ำกว่า ซึ่งบางครั้งนำไปสู่ประสบการณ์การใช้งานที่แตกต่างกันด้วยกลยุทธ์การโหลดแบบปรับอัตโนมัติที่มีอยู่
redBus ใช้การเปลี่ยนมุมมองสำหรับเส้นทางของผู้ใช้ที่หลากหลาย เช่น ในส่วนการแก้ปัญหาด้วยตนเองภายในแอปบนอุปกรณ์เคลื่อนที่ซึ่งเปิดหน้าเว็บในแท็บ Chrome ที่กำหนดเองและใน Funnel การจองตั๋วรถบัสที่ผู้ใช้จากหน้าข้อมูลสินค้าคงคลังไปยังหน้าการชำระเงิน ในกรณีหลัง การเปลี่ยนการดูทำให้การไปยังส่วนต่างๆ ของหน้าเว็บทำได้ราบรื่นขึ้น และส่งผลให้อัตรา Conversion เพิ่มขึ้น การดำเนินการนี้เป็นผลมาจากประสบการณ์ของผู้ใช้ที่ดีขึ้นและประสิทธิภาพที่รับรู้ได้ดีขึ้น ขณะที่การดำเนินการหนัก เช่น การดึงข้อมูลพื้นที่โฆษณาที่พร้อมใช้งานที่อัปเดตล่าสุด ได้รับการดำเนินการ
รายละเอียดทางเทคนิคของการใช้งาน
redBus ใช้ React และ EJS เป็นชุดซอฟต์แวร์ฟรอนท์เอนด์ ด้วยการผสมผสานระหว่าง SPA และ MPA ในเส้นทางที่แตกต่างกัน ข้อความโค้ดที่ตัดตอนมาต่อไปนี้แสดงวิธีใช้การเปลี่ยนมุมมอง
/* Forward Transition */
export const goToURL = ( url: string , reactHistory: any ): void => {
if(document.startViewTransition) {
let viewTransition = document.startViewTransition();
viewTransition.ready.finally(() => {
reactHistory ? reactHistory.push(url) : (window.location.href = url);
})
} else {
reactHistory ? reactHistory.push(url) : (window.location.href = url);
}
};
/* Back Transition */
export const goBack = ( reactHistory: any ): void => {
if(document.startViewTransition) {
document.documentElement.classList.add('back-transition');
let viewTransition = document.startViewTransition();
viewTransition.ready.finally(() => {
reactHistory ? reactHistory.goBack() : history.back();
})
viewTransition.finished.finally(() => {
document.documentElement.classList.remove('back-transition');
})
} else {
reactHistory ? reactHistory.goBack() : history.back();
}
};
ใน CSS, slide-to-right
, slide-to-left
, slide-from-right
และ slide-from-left
ต่อไปนี้เป็นคีย์เฟรมภาพเคลื่อนไหว CSS
::view-transition-old(root) {
animation: 300ms cubic-bezier(0.4, 0, 1, 1) both fade-out,
300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-to-left;
}
::view-transition-new(root) {
animation: 700ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in,
700ms cubic-bezier(0.4, 0, 0.2, 1) both slide-from-right;
}
.back-transition::view-transition-old(root) {
animation: 300ms cubic-bezier(0.4, 0, 1, 1) both fade-out,
300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-to-right;
}
.back-transition::view-transition-new(root) {
animation: 700ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in,
700ms cubic-bezier(0.4, 0, 0.2, 1) both slide-from-left;
}
ผลลัพธ์ทางธุรกิจ
redBus เลือกใช้การเปลี่ยนมุมมอง ควบคู่ไปกับความพยายามในการปรับปรุง INP ทั่วทั้งเว็บไซต์ ซึ่งส่งผลให้มียอดขายเพิ่มขึ้น 7% Amit Kumar ผู้จัดการฝ่ายวิศวกรรมอาวุโสของ redBus กล่าวว่าการเปลี่ยนผ่านมุมมองนั้นยอดเยี่ยมมากสำหรับผู้ที่ต้องการประสบการณ์ของผู้ใช้ที่ดีขึ้นจริงๆ และไม่ต้องการค่าใช้จ่ายในการบำรุงรักษา
เราได้จัดเซสชันแสดงความคิดเห็นเกี่ยวกับผู้ใช้ที่ครอบคลุมซึ่งรวมข้อมูลเชิงลึกที่มีประโยชน์จากผู้ใช้หลากหลายกลุ่ม ด้วยความเข้าใจอย่างถ่องแท้เกี่ยวกับฐานผู้ใช้ (รถประจำทางและรถไฟ) และความต้องการของผู้ใช้ ประกอบกับความเชี่ยวชาญของเรา ทำให้เราเชื่อว่าฟีเจอร์นี้จะให้ประโยชน์ที่สำคัญตั้งแต่แรกโดยไม่ต้องทำการทดสอบ A/B การเปลี่ยนมุมมองเป็นขั้นตอนหนึ่งที่จะช่วยลดช่องว่างระหว่างแอปและเว็บด้วยประสบการณ์การนำทางที่ราบรื่น
Anoop Menon ประธานเจ้าหน้าที่ฝ่ายเทคโนโลยี RedBus
CyberAgent
CyberAgent เป็นบริษัทไอทีของญี่ปุ่นที่ให้บริการออนไลน์มากมาย รวมทั้งบล็อกและการเผยแพร่เนื้อหาข่าว
เหตุใด CyberAgent จึงใช้การเปลี่ยนมุมมอง
CyberAgent เคยพิจารณาใช้ภาพเคลื่อนไหว CSS หรือใช้เฟรมเวิร์กเพื่อดำเนินการเปลี่ยนภาพเคลื่อนไหวเพื่อปรับปรุงประสบการณ์ของผู้ใช้ แต่พวกเขากังวลกับประสิทธิภาพที่ต่ำในการแสดงผล DOM และความสามารถในการบำรุงรักษาโค้ด เมื่อ Chrome เพิ่มการรองรับ API การเปลี่ยนมุมมอง ทางบริษัทก็รู้สึกตื่นเต้นที่จะได้ใช้เพื่อสร้างการเปลี่ยนหน้าที่น่าสนใจและเอาชนะความท้าทายเหล่านี้ได้
CyberAgent ใช้การเปลี่ยนมุมมองระหว่างรายการบล็อกและหน้าบล็อก ในส่วนนี้ ให้สังเกตวิธีที่แบรนด์เพิ่มการเปลี่ยนองค์ประกอบให้กับรูปภาพหลัก คุณสามารถเข้าชมเว็บไซต์ของธุรกิจนี้และสัมผัสประสบการณ์จริงได้แล้ววันนี้
นอกจากนี้ยังใช้คำค้นหาสื่อเพื่อออกแบบประสบการณ์การใช้งานแอนิเมชันที่แตกต่างกันให้กับแต่ละอุปกรณ์อีกด้วย สําหรับหน้าเว็บในอุปกรณ์เคลื่อนที่ องค์ประกอบนี้มีการเปลี่ยนองค์ประกอบ แต่เอฟเฟกต์นี้มีการเคลื่อนไหวมากเกินไปสําหรับเดสก์ท็อป
@media screen and (min-width: 769px) {
.main-visual {
view-transition-name: none !important;
}
}
รายละเอียดทางเทคนิคของการใช้งาน
CyberAgent ใช้ Next.js ในการสร้าง SPA ตัวอย่างโค้ดต่อไปนี้แสดงให้เห็นวิธีการใช้ View Transition API
export const usePageTransition = () => {
const router = useRouter();
const defferedRef = useRef<Deferred | null>(null);
useEffect(() => {
const handleRouteChangeComplete = () => {
defferedRef.current?.resolve();
};
const handleRouteChangeStart = (url: string) => {
if (!("startViewTransition" in document)) return;
if (router.asPath === url) return;
const deffered = new Deferred();
defferedRef.current = deffered;
(document as Document).startViewTransition(async () => {
await deffered.promise;
});
};
router.events.on("routeChangeStart", handleRouteChangeStart);
router.events.on("routeChangeComplete", handleRouteChangeComplete);
return () => {
router.events.off("routeChangeStart", handleRouteChangeStart);
router.events.off("routeChangeComplete", handleRouteChangeComplete);
};
}, [router.asPath]);
};
ดูตัวอย่างโค้ด Next.js เพิ่มเติม
ดูการเปลี่ยนสำหรับ MPA ด้วยเทคโนโลยีการแสดงผลล่วงหน้า
CyberAgent ยังได้ลองใช้ View Transitions API for Multiple Page Apps (MPA) ใหม่ (ปัจจุบันอยู่ภายใต้ธง chrome://flags/#view-transition-on-navigation
) ในบริการที่ชื่อว่า Ameba News ซึ่งเป็นเว็บไซต์พอร์ทัลข่าวด้วย
มีการใช้ทรานซิชันการดูใน 2 ที่ คือ ตอนเปลี่ยนหมวดหมู่ของข่าวสาร ซึ่งแสดงในวิดีโอถัดไป
อย่างที่ 2 คือระหว่างหน้าไฮไลต์ข่าว ซึ่งเป็นส่วนแสดงข้อความที่ตัดตอนมาจากเนื้อหา และเมื่อผู้ใช้คลิกเพื่อดูรายละเอียดเพิ่มเติม ส่วนที่เหลือของบทความจะค่อยๆ เลือนหายไป
ประเด็นที่น่าสนใจคือพวกเขาเพิ่มภาพเคลื่อนไหวเฉพาะส่วนที่จะเปลี่ยนแปลงหลังจากคลิกปุ่ม การปรับแต่งการออกแบบภาพเคลื่อนไหวเล็กๆ น้อยๆ นี้ทำให้หน้า MPA ดูคล้ายกับ SPA มากขึ้นจากมุมมองของผู้ใช้ โดยมีเพียงเนื้อหาใหม่เคลื่อนไหวในสิ่งต่อไปนี้
วิธีทำก็คือมอบหมาย view-transition-name
ที่แตกต่างกันให้กับส่วนต่างๆ ของหน้าเว็บ ตัวอย่างเช่น พวกเขากำหนด view-transition-name
หนึ่งให้กับส่วนบนสุดของบทความ และอีก 1 รายการสำหรับส่วนล่าง และไม่เพิ่มภาพเคลื่อนไหวที่ส่วนบน
::view-transition-old(root) {
animation:
var(--animation-disappear-duration) var(--animation-disappear-easing) both fade-out;
}
::view-transition-new(root) {
animation:
var(--animation-appear-in-duration) var(--animation-appear-in-easing) both fade-in;
}
สิ่งที่น่าสนใจอีกอย่างเกี่ยวกับการใช้ View Transits API ของ CyberAgent ก็คือการใช้ quicklink เพื่อนำกฎการแสดงผลล่วงหน้าในหน้ารายละเอียดได้อย่างง่ายดาย นี่คือโค้ดตัวอย่าง
import { prerender } from ‘https://.../quicklink.mjs’;
window.addEventListener('load', () => {
const match = location.pathname.match(/\\/(.+)\\/hl\\/([0-9a-z-_]+)/);
if (!match) return;
const [_, dirname, entryId] = match;
prerender(`/${dirname}/${entryId}/`);
});
อ่านข้อมูลเพิ่มเติมเกี่ยวกับการใช้งาน Quick Link ได้จากบทความนี้
คำนิยม
Kazuroi Hara หัวหน้าฝ่ายเทคโนโลยีของบริการ Ameba ใน CyberAgent กล่าวว่าการเปลี่ยนมุมมองอาจส่งผลต่อธุรกิจอย่างมากด้วยเหตุผล 2 ประการ
ประการแรก โฆษณาจะนำทางผู้ใช้ในหน้าเว็บ การเปลี่ยนมุมมองช่วยให้สามารถโฟกัสผู้ใช้ไปที่ข้อความที่สำคัญที่สุดด้วยสายตา และช่วยให้ผู้ใช้ได้รับประโยชน์สูงสุดจากหน้าเว็บ นอกจากนี้ยังเพิ่มประสิทธิภาพและเน้นย้ำแบรนด์ด้วยภาพเคลื่อนไหว CyberAgent มีการออกแบบภาพเคลื่อนไหวที่กำหนดเพื่อสื่อสารแบรนด์ของตน ด้วยการเปลี่ยนมุมมอง พวกเขาสามารถนำประสบการณ์ของแบรนด์นี้ไปใช้ได้โดยไม่ต้องเพิ่มค่าใช้จ่ายในการบำรุงรักษาไลบรารีภายนอก
ดูการเปลี่ยนรุ่นเป็นหนึ่งใน API ที่ฉันชอบ ความสามารถในการเพิ่มภาพเคลื่อนไหวเป็นฟีเจอร์มาตรฐานของเบราว์เซอร์ทำให้สามารถใช้และดูแลรักษาการเปลี่ยนมุมมองได้ง่ายขึ้นเมื่อเทียบกับโซลูชันอื่นๆ ที่ใช้ไลบรารี เราหวังว่าจะนำการเปลี่ยนมุมมองไปใช้บริการอื่นๆ เพื่อสื่อสารกับแบรนด์ของเราต่อไป
Kazunari Hara, CTO ของ Ameba
ไนกา
Nykaa เป็นแพลตฟอร์มอีคอมเมิร์ซด้านแฟชั่นและความงามที่ใหญ่ที่สุดของอินเดีย โดยมุ่งหวังที่จะมอบประสบการณ์การใช้งานเว็บบนอุปกรณ์เคลื่อนที่ให้ใกล้เคียงกับประสบการณ์ในแอปที่มาพร้อมเครื่องที่สุดเท่าที่จะทำได้ เมื่อพยายามใช้ภาพเคลื่อนไหวการเปลี่ยน ก่อนหน้านี้พบว่าเขียน JavaScript ที่กำหนดเองซึ่งมีความซับซ้อน ซึ่งส่งผลต่อประสิทธิภาพของเว็บไซต์เพียงเล็กน้อย
เหตุใด Nykaa จึงใช้การเปลี่ยนมุมมอง
เมื่อมาถึงช่วงการเปลี่ยนมุมมอง ทีมของ Nykaa ก็มองเห็นโอกาสที่การเปลี่ยนเหล่านี้พร้อมใช้งานตั้งแต่แรกเริ่มจึงทำให้ UX ของการเปลี่ยนหน้าได้รับการปรับปรุงอย่างมากโดยไม่ต้องเสียค่าใช้จ่ายใดๆ ในการเพิ่มประสิทธิภาพ Nykaa กำลังใช้การเปลี่ยนมุมมองครั้งใหญ่เพื่อเปลี่ยนจากหน้ารายละเอียดผลิตภัณฑ์ไปเป็นหน้าข้อมูลผลิตภัณฑ์ที่แสดง
รายละเอียดทางเทคนิคของการใช้งาน
Nykaa ใช้ React และ Emotion ในการสร้าง SPA ดูโค้ดตัวอย่างเพิ่มเติมเกี่ยวกับวิธีใช้ "View Transitions with React" ได้ที่นี่
if (document.startViewTransition) {
document.startViewTransition(() => {
history.push(productUrl);
});
} else {
history.push(productUrl);
}
const fadeIn = keyframes`
from { opacity: 0; }
`;
const fadeOut = keyframes`
to { opacity: 0; }
`;
const slideFromRight = keyframes`
from { transform: translateX(300px); }
`;
const slideToLeft = keyframes`
to { transform: translateX(-300px); }
`;
const slideToRight = keyframes`
to { transform: translateX(300px); }
`;
const slideFromLeft = keyframes`
from { transform: translateX(-300px); }
`
CSS สำหรับภาพเคลื่อนไหวที่ลิ้นชักด้านข้าง
::view-transition-old(root) {
animation: 300ms cubic-bezier(0.4, 0, 1, 1) both ${fadeOut},
1000ms cubic-bezier(0.4, 0, 0.2, 1) both ${slideToLeft};
}
::view-transition-new(root) {
animation: 400ms cubic-bezier(0, 0, 0.2, 1) 300ms both ${fadeIn},
1000ms cubic-bezier(0.4, 0, 0.2, 1) both ${slideFromRight};
}
.back-transition {
display: inherit;
}
.back-transition::view-transition-old(root) {
animation-name: fade-out, ${slideToRight};
}
.back-transition::view-transition-new(root) {
animation-name: fade-in, ${slideFromLeft};
}
คำนิยม
Sunit Jindal หัวหน้าฝ่ายแอปของ Nykaa กล่าวว่าประโยชน์ที่สำคัญที่สุดของการเปลี่ยนผ่านมุมมองคือ "การรับรู้ความเร็ว" Nykaa ใช้เอฟเฟกต์แวววาวเพื่อรอให้เนื้อหาโหลดจากแบ็กเอนด์ แต่พบว่าการแสดงเอฟเฟกต์แวววาวไม่ได้ทำให้ผู้ใช้ต้องรอนานเท่าที่ควรรอให้เนื้อหาโหลด การเปลี่ยนมุมมองทำให้ผู้ใช้รู้สึกว่า "กำลังจะมีบางอย่างเกิดขึ้น" ซึ่งทำให้ผู้ใช้รอน้อยลง
Nykaa รู้สึกตื่นเต้นมากกับ UX ที่เพิ่มประสิทธิภาพใหม่ของหน้าเว็บพร้อมกับการเปลี่ยนการแสดงผล และพร้อมที่จะใช้การเปลี่ยนการแสดงผลในหน้าเพิ่มเติมด้วย รองประธานฝ่ายออกแบบกล่าวว่า
เรามุ่งมั่นที่จะนำการเปลี่ยนมุมมองไปใช้ในฟีเจอร์ที่กำลังจะเปิดตัวทั้งหมดตามความเหมาะสม เราได้ระบุปัญหาบางส่วนไว้แล้วและทางทีมก็กำลังลงทุนกับพื้นที่ดังกล่าวอย่างเต็มที่
Krishna R V รองประธานฝ่ายออกแบบ
PolicyBazaar
PolicyBazaar มีสำนักงานใหญ่ตั้งอยู่ที่เมือง Gurgaon และเป็นบริษัทผู้รวบรวมข้อมูลประกันภัยและบริษัทเทคโนโลยีการเงินข้ามชาติที่ใหญ่ที่สุดในอินเดีย
เหตุใด PolicyBazaar จึงใช้การเปลี่ยนมุมมอง
ในฐานะบริษัทที่เน้นเว็บเป็นหลัก ทีม PolicyBazaar มุ่งมั่นที่จะมอบประสบการณ์ที่ดีที่สุดแก่ผู้ใช้ตลอดเส้นทางที่สำคัญของผู้ใช้ แนวทางปฏิบัติทั่วไปคือการใช้การเปลี่ยนที่กำหนดเองโดยใช้ JavaScript และ CSS ก่อนที่จะเปิดตัว View Transitions API เนื่องจากโซลูชันเหล่านี้ช่วยปรับปรุงประสบการณ์ของผู้ใช้ สร้างขั้นตอนการนำทางที่ราบรื่น และปรับปรุงความน่าสนใจของภาพโดยรวมของเว็บไซต์
อย่างไรก็ตาม การใช้งานที่กำหนดเองเหล่านี้มีค่าใช้จ่ายสำหรับความล่าช้าตามประสิทธิภาพ ความซับซ้อนในการบำรุงรักษาโค้ด และความเข้ากันได้ที่ต่ำกว่ากับเฟรมเวิร์กที่ใช้ View Transitions API ช่วยให้บริษัทเอาชนะความท้าทายส่วนใหญ่เหล่านี้ได้ โดยมีอินเทอร์เฟซที่ใช้งานง่ายพร้อมสิทธิประโยชน์ด้านประสิทธิภาพที่มีให้ในแพลตฟอร์ม
PolicyBazaar ใช้การเปลี่ยนมุมมองในองค์ประกอบต่างๆ ในเส้นทางก่อนการเสนอราคา เพื่อให้ผู้มีโอกาสเป็นผู้ซื้อตื่นเต้นกับรายละเอียดที่จำเป็นของตนในการซื้อกรมธรรม์ประกันภัย
รายละเอียดทางเทคนิคของการใช้งาน
โดยใช้แนวทางเฟรมเวิร์กแบบผสมกับ Angular และ React ที่ครองฐานของโค้ดส่วนใหญ่ นี่คือ VT ที่ตัดตอนมาจากโค้ดของพวกเขาซึ่งเขียนใน Angular และแชร์โดย Aman Soni (หัวหน้านักพัฒนาฟรอนท์เอนด์ของ PolicyBazaar)
toggleWidgetAnimation() {
let doc:any = document;
if (!doc.startViewTransition) {
this.toggleWidget();
return;
}
doc.startViewTransition(() => this.toggleWidget());
}
toggleWidget() {
let badgeEle = document.querySelector('.animate_init_state_one');
let textEle = document.querySelector('.animate_init_state_two');
badgeEle.classList.toggle('hide');
textEle.classList.toggle('hide');
}
คำนิยม
Rishabh Mehrotra หัวหน้าฝ่ายออกแบบ (Life BU) กล่าวว่าการเปลี่ยนผ่านการดูมีบทบาทสำคัญในการปรับปรุงประสบการณ์การใช้งานเว็บไซต์ของผู้ใช้ด้วยการปรับปรุงความสามารถในการใช้งาน การมีส่วนร่วม และความพึงพอใจโดยรวม โดยช่วยให้การนำทางที่ราบรื่น การโต้ตอบแบบมีคำแนะนำ ลดภาระทางความคิด สุนทรียภาพที่ทันสมัย และอื่นๆ อีกมากมาย
การยกระดับประสบการณ์การใช้งานเว็บเป็นวัตถุประสงค์ที่สำคัญที่สุดสำหรับ PB และ VT ก็ได้พิสูจน์แล้วว่าเป็นเครื่องมือเป็นเครื่องมือที่ช่วยให้บรรลุวัตถุประสงค์นี้ได้อย่างลื่นไหลลงตัว การได้รับความสนใจอย่างกว้างขวางในหมู่ชุมชนนักพัฒนาซอฟต์แวร์และฐานผู้ใช้ของเราทำให้ทีมของเรารู้สึกกระตือรือร้นอย่างมาก ขณะที่เราพิจารณาการผนวกรวมกับ POD ที่หลากหลาย เราคาดหวังผลกระทบเชิงบวกที่จะขยายต่อระดับความพึงพอใจและความเป็นเลิศในการดำเนินการ
Saurabh Tiwari (CTO, PolicyBazaar)
ขั้นตอนถัดไป
คุณสนใจลองใช้การเปลี่ยนมุมมองไหม คุณสามารถติดตามข้อมูลเพิ่มเติมได้จากแหล่งข้อมูลต่อไปนี้