# Fully Booked - वेब और मोबाइल के लिए इंटरैक्टिव फिग्मा प्रोटोटाइप

Company: Fully Booked
Service: अतिरिक्त सेवाएँ
Period: 2023-04 - 2025-06
Tech: Figma
Web: https://fully-booked.uk/
Canonical: https://webanion.com/hi/portfolio/fully-booked-interactive-figma-prototype-for-web-and-mobile

Fully Booked का हर चरण एक क्लिक करने लायक Figma प्रोटोटाइप के रूप में जोड़ा गया, ताकि संस्थापक उसे बनवाने के लिए पैसे देने से पहले चलाकर देख सकें, सवाल कर सकें और मंज़ूरी दे सकें। ऐप, ग्राहक वेबसाइट और एडमिन की तीन फ़ाइलें एक ही स्टाइल और कंपोनेंट साझा करती हैं, और ऑपरेटरों के भेजे दस्तावेज़ उसी टैप के साथ प्रोटोटाइप किए गए हैं जिससे वे भेजे जाते हैं। डेवलपरों ने अंदाज़ों के बजाय तैयार फ़्रेम से काम किया, और हर चरण अपने दायरे में रहा। MVP को Webanion के एक अन्य डिज़ाइनर ने डिज़ाइन किया था; चरण 2, 3 और 4 का रीडिज़ाइन मेरा अपना है।

## पूरी कहानी

क्लिक करने लायक प्रोटोटाइप ने हर चरण को ऐसी चीज़ बना दिया जिसे संस्थापक भुगतान से पहले आज़मा सकें, उस पर सवाल कर सकें और मंज़ूरी दे सकें।

### बनने से पहले ही एक चरण को क्लिक करके देखना

<p>Fully Booked के हर चरण का एक तय बजट था, और एक संस्थापक थे जिन्हें पक्का करना था कि यह ऑपरेटरों के काम आएगा। किसी सुविधा का वर्णन करने वाला दस्तावेज़ आसानी से गलत समझा जा सकता है; जिस प्रोटोटाइप में टैप करते हुए आगे बढ़ा जा सके, वह नहीं। इसलिए हर चरण पहले Figma में डिज़ाइन करके जोड़ा गया, और डेवलपमेंट शुरू होने से पहले संस्थापक ने उसे क्लिक करके देखा।</p><p>प्रोटोटाइप में पकड़ी गई गलती की कीमत कुछ मिनट होती है, और वही गलती कोड में पकड़ी जाए तो कुछ दिन। इस तरह काम करने से हर चरण अपने दायरे में रहा और डेवलपरों को हर स्क्रीन का एक तैयार संदर्भ मिला।</p>

### तीन फ़ाइलें, एक प्रोडक्ट

<p>यह काम तीन Figma फ़ाइलों में है, मोबाइल ऐप्लिकेशन, कस्टमर वेबसाइट और एडमिन डैशबोर्ड के लिए एक-एक, और तीनों रंग स्टाइल और कंपोनेंट का एक ही सेट साझा करती हैं। ऐप से PDF और फिर बिज़नेस पेज तक जाने वाला ऑपरेटर एक ही ब्रांड देखता है, और किसी भी हिस्से को बनाने वाला डेवलपर वही टोकन पढ़ता है।</p>

### असली प्रोडक्ट की तरह जुड़ा हुआ

<p>स्क्रीनें फ़्लो में जुड़ी हैं, इसलिए किसी बुकिंग पर टैप करने से उसका ब्योरा, नक्शे पर उसका रूट और उसके बाद की हर स्थिति खुलती है। बुकिंग ब्योरे का प्रोटोटाइप हर रूप को उनके बीच के रास्तों के साथ अगल-बगल रखता है, और इसी तरह संस्थापक ने नक्शे वाली स्क्रीनों को बनने से पहले मंज़ूरी दी।</p>

### हर दस्तावेज़, उसे भेजने वाले टैप के साथ प्रोटोटाइप किया गया

<p>दस्तावेज़ों का पूरा सेट, कोटेशन, रद्दीकरण, आमंत्रण, इनवॉइस, पुष्टि और ड्राइवर शीट, Figma में सजाया गया, और हर एक तक उस ऐप स्क्रीन से तीर खींचे गए जहाँ से वह भेजा जाता है। संस्थापक ऑपरेटर के टैप से लेकर ग्राहक को मिलने वाले पेज तक पूरा रास्ता देख सकते थे, और साथ ही शब्दों को भी मंज़ूरी दे सकते थे।</p>

### होम स्क्रीन, कई रूपों में आज़माई गई

<p>ऑपरेटर की होम स्क्रीन प्रोटोटाइप में कई वर्ज़न से गुज़री, और हर वर्ज़न को एक ही कसौटी पर परखा गया: क्या ऑपरेटर देख पाता है कि उसने कितना कमाया, और क्या वह एक टैप में और कमाने के हर रास्ते तक पहुँच पाता है। जो रूप चुना गया, वही आज ऐप में है।</p>

### कोड की एक लाइन से पहले ही बिज़नेस पेज

<p>ऑपरेटरों को सीधी बुकिंग दिलाने वाला बिज़नेस पेज पूरी तरह डिज़ाइन किया गया, वाहन बेड़े की गैलरी, परिचय वाले हिस्से, रिव्यू, नक्शे, खुलने के समय और बुकिंग फ़ॉर्म के साथ, और उसका कोई भी हिस्सा बनने से पहले प्रोटोटाइप के रूप में उसकी समीक्षा हुई। सीधी बुकिंग लाने वाला चरण एक ऐसे पेज से शुरू हुआ जिस पर सब पहले से सहमत थे।</p>

### एडमिन और कस्टमर वेबसाइट की फ़ाइलें

<p>एडमिन और कस्टमर वेबसाइट की फ़ाइलों में लॉगिन से लेकर भुगतान तक हर पेज और हर स्थिति है, इसलिए वेब डेवलपरों ने अंदाज़ों से नहीं, तैयार फ़्रेम से काम किया। हर चरण ने अपने पेज इन्हीं फ़ाइलों में जोड़े, जिससे सालों बाद भी प्रोडक्ट एक जैसा बना रहता है।</p>

### प्रोटोटाइप से क्या मिला

<p>संस्थापक के लिए प्रोटोटाइप का मतलब था भरोसे के साथ सुविधाओं को मंज़ूरी देना और सिर्फ़ तय किए गए काम का भुगतान करना। डेवलपरों के लिए इसका मतलब था कोई अस्पष्टता नहीं, और ऑपरेटरों और ग्राहकों के लिए ऐसी स्क्रीनें जिन पर किसी के फ़ोन तक पहुँचने से पहले ही बहस हो चुकी थी।</p><p>स्क्रीनों के पीछे की सोच <a href="/portfolio/fully-booked-ui-ux-design-for-mobile-app-and-admin-panel">UI और UX की कहानी</a> में है, और तैयार प्रोडक्ट <a href="/portfolio/fully-booked-all-in-one-smart-booking-solution">Fully Booked की कहानी</a> में।</p>
