ساخت یک صفحه ورود جذاب بصری قبلاً به معنای استخدام توسعهدهندگان یا یادگیری کدنویسی بود. اما اکنون با ادغام ChatGPT و Gemini در Page Builder سلدون، دیگر اینطور نیست. این فرآیند کاری جدید که به کمک هوش مصنوعی انجام میشود، به هر کسی— بدون توجه به تجربه فنی— اجازه میدهد تا یک تصویر ساده، طراحی ابتدایی یا حتی یک ایده خام را به بخشی زیبا و کاملا واکنشگرا برای فروشگاه آنلاین یا صفحه ورود خود تبدیل کند. همه چیز بهصورت فوری در محیط سلدون انجام میشود، بدون نیاز به کدنویسی دستی.
چه شما در حال ساخت برند شخصی خود باشید یا مدیریت یک کسبوکار آنلاین، این روش به شما اجازه میدهد تا صفحات مدرن و شکیل را در چند دقیقه راهاندازی کنید.
از مفهوم تا مؤلفه در دقایق
فرض کنید شما یک طراحی که آن را دوست دارید میبینید. ممکن است این یک نمایش محصول در وبسایت دیگر، بنر بازاریابی که در Canva ایجاد کردهاید، یا حتی فقط یک اسکرینشات ذخیره شده باشد. نیازی نیست کدنویسی آن را یاد بگیرید یا بدانید از کجا شروع کنید. به سادگی تصویر را آپلود کنید یا طرح را توضیح دهید و از ChatGPT (با استفاده از افزونه سلدون) یا Gemini بخواهید آن را به یک بخش صفحه ورود تبدیل کنند. هوش مصنوعی زبان فنی سلدون و ساختار مؤلفههای Vue دینامیک بهکاررفته در این پلتفرم را درک میکند. شما یک بلوک کد آماده دریافت خواهید کرد که مستقیماً قابل کپی و پیست در Page Builder سلدون است. این بخش شامل موارد زیر خواهد بود:
تمامی متنها و سرفصلها
تصاویر و لینکها
دکمهها، فونتها و رنگها
ویژگیهای دینامیک مانند کارتهای محصول یا نظرات مشتریان
مهمتر اینکه، این قالب بهصورت خودکار واکنشگرا برای دسکتاپ، تبلت و موبایل خواهد بود.
فرآیند ساده برای نتایج قدرتمند
برای افزودن این بخش به صفحه سلدون خود، مراحل زیر را دنبال کنید:
ایده طراحی خود را به ChatGPT یا Gemini آپلود یا توصیف کنید.
درخواست یک مؤلفه Vue سازگار با Page Builder سلدون کنید.
کد تولید شده را کپی کنید.
در Page Builder سلدون، عنصر کد را به صفحه ورود کشیده و رها کنید
نکته: از دسکتاپ خود، تصویر طراحی مورد نظر که به ChatGPT آپلود میکنید. همراه با تصویر، توضیح دقیقی ارائه دهید تا به ایجاد مؤلفه دقیقتر کمک کند و از ویرایشهای آینده جلوگیری کند.
نمونه پیشنهادی:
بخش جدید شما زنده است، کاملاً طراحی شده و آماده برای موبایل. حال میتوانید آن را از طریق پنل مشخصات شخصیسازی کنید یا برای درخواست ویرایشها به هوش مصنوعی بازگردید—چه تغییر چیدمان، تغییر رنگها، افزودن ویژگیها یا جایگزینی متنها باشد.
پیشنهادات برای بهترین نتایج
برای کمک به درک دقیقی که هوش مصنوعی از آنچه نیاز دارید، پیشنهاد میکنیم از این نمونه استفاده کنید:
لطفاً یک مؤلفه Vue واکنشگرا برای Page Builder سلدون براساس این تصویر یا توصیف ایجاد کنید. تمام متنها، دکمهها، تصاویر، رنگها و فونتها باید در شیء properties تعریف شوند. مؤلفه باید مطابق با استانداردهای Vuetify 3، واکنشگرا در سراسر دستگاهها و مطابق با قوانین سلدون باشد، از جمله عدم استفاده از تگهای خودبسته. در صورت امکان، کارتهای محصول، ستارههای امتیاز، و دکمههای عملکرد شامل شوند. برای تمام متنها و کارتها و دکمهها، لطفاً ابزار انتخاب رنگ تصویری، اندازه فونت، وزن فونت و شعاع را اضافه کنید.
میتوانید هر زمان که خواستید یک بخش را ایجاد یا تنظیم کنید از این نمونه استفاده کنید. این از تولید کد به صورت تمیز و مطابق با نیازهای سلدون اطمینان میدهد.
کاملاً قابل سفارشیسازی و مقیاسپذیر
پس از اینکه بخش شما در جای خود قرار گرفت، محدود به آنچه شروع کردید نیستید. میتوانید از ChatGPT یا Gemini بخواهید هر چیزی را تغییر دهد:
تغییر یا جابجایی یک تصویر
بروزرسانی عناوین و زیرعناوین
افزودن دکمهها، اسلایدرها، نظرات مشتریان یا بنرهای جدید
تنظیم سبک و اندازههای متن
تغییر فواصل و چیدمان برای ظاهری متفاوت
میتوانید صفحه را با بخشهای جدید گسترش دهید. هیچ محدودیتی در تعداد مؤلفههایی که میتوانید اضافه کنید وجود ندارد و هرکدام از آنها روی همان ساختار قابل اعتماد و انعطافپذیر ساخته خواهد شد. هر عنصر قابل ویرایش است. رنگها را میتوان با استفاده از ابزارهای انتخاب رنگ تصویری، تغییر داد و تصاویر را میتوان بهراحتی جایگزین یا آپلود کرد. این تجربه به گونهای طراحی شده که حتی اگر قبلاً از یک صفحهساز استفاده نکردهاید نیز قابل درک باشد.
خطاهای ممکن
خطا شماره 1
اگر بعد از قرار دادن کد در سازنده سلدون (همانطور که در تصویر زیر نشان داده شده) با خطا مواجه شدید، بهسادگی از ChatGPT یا Gemini بخواهید که به شما کمک کنند آنها را رفع کنید.
ابزارها بهصورت خودکار پاسخ میدهند و شروع به رفع خطای کد شما میکنند.
My Chat with Gemini and its Answer to the Error
خطا شماره 2
اگر کد را در زبانه HTML کپی و جایگذاری کنید، بخش بهصورت خالی نمایش داده میشود:
همانطور که میبینید، من بهاشتباه کد را در زبانه HTML وارد کردم که نباید این کار را میکردم.
خطا شماره 3
گاهی اوقات وقتی درخواست اضافه کردن یک اسلایدر، چرخ و فلک یا نوار اسکرول به یک بخش را میدهید، ممکن است متوجه شوید عناصر ناخواستهای مانند نقاط اضافی، خط تیره یا دکمههای پیکان خارج از بخش نمایش داده میشوند. این معمولاً به این دلیل است که ChatGPT از MDI (آیکونهای طراحی متریال) بهجای آیکونهای گوگل فونت مورده استفاده کرده است. برای رفع این مشکل، مطمئن شوید که از ChatGPT بخواهید فقط از آیکونهای رسمی متریال گوگل استفاده کند.
قبل از شروع، این نکات را بخوانید:
گاهی اوقات بعد از پاسخگویی ابزار، ممکن است نیاز به درخواست نوشتن کامل کد از آن داشته باشید. اگر تغییرات جزئی باشند و کد اصلی طولانی باشد، ممکن است به جای نوشتن دوباره کل بلوک، ترجیح بدهند که به شما دستور دهند تا خطوط خاصی را جایگزین کنید.
توصیه میشود که برای هر بخش جدید یک مکالمه جدید با ChatGPT در سلدون شروع کنید. ادامه مکالمه از جلسات قبلی ممکن است سبب شود که ابزار دستورالعملهای قدیمی را اعمال کند که برای مؤلفه جدید شما مرتبط نیستند.
گاهی اوقات ChatGPT ممکن است به شما ورودی در ویژگیهای مؤلفه سلدون بدهد تا یک URL تصویر وارد کنید، اما تصویر شما بر روی کامپیوتر محلیتان ذخیره شده است. در چنین مواردی، از ChatGPT بخواهید تا عنصر (مثلاً یک چرخ و فلک یا اسلایدر) را به عنوان یک شیء تعریف کند، تا بتوانید تصاویر را بهطور مستقیم بهجای استفاده از URLها آپلود کنید.
اگر یک تصویر شامل بسیاری از عناصر بصری باشد، میتوانید آن را به سادگی به ChatGPT آپلود کنید و درخواست یک توصیف کنید. سپس آن توصیف را کپی کرده و به عنوان یک درخواست برای ایجاد مؤلفه از آن استفاده کنید. این روش غالباً به نتایج بهتر و دقیقتری منجر میشود.
چرا این مهم است
با این فرآیند، هر کسی میتواند از مفهومی بصری به یک بخش ورود واکنشگرای آماده تولید در عرض چند دقیقه برسد. دیگر نیازی به انتظار برای توسعهدهندگان یا مبارزه با سازندههای چیدمان ندارید. نیازی به یادگیری Vue، CSS یا طراحی واکنشگرا نیست. همه چیز توسط هوش مصنوعی ایجاد شده بهصورت بهینهسازی شده است تا در تمام دستگاهها زیبا به نظر برسد. نیازی به نگرانی از خرابی چیدمان، تغییر اندازه تصاویر یا نوشتن قواعد سبک ندارید. بخشها از استانداردهای دقیق براساس زبان طراحی و بهترین شیوههای سلدون پیروی میکنند. شما بیشتر وقت خود را صرف ایجاد خواهید کرد و کمتر وقت را صرف رفع مشکلات.
امروز امتحان کنید
شروع به کار ساده است. بخشی را که مایلید ایجاد کنید انتخاب کنید—چه الهامگرفته از وبسایتی دیگر باشد، چه طراحی ابتدایی، یا فلایر محصول—و آن را به ChatGPT یا Gemini با استفاده از پیشنهادات توصیه شده توصیف کنید. شما کد را دریافت میکنید، آن را در سلدون کپی میکنید، و صفحه ورود شما زنده میشود.
سرعت دارد؛ آسان است و بیپایان. هیچ محدودیتی بر خلاقیت نیست و هیچ همتایی بر آنچه میتوانید انجام دهید وجود ندارد. با هوش مصنوعی و سلدون، ساخت صفحات وب قدرتمند و زیبا اکنون به سادگی توصیف کردن آنچه میخواهید تبدیل شده است.
افزودن نظر
