لطفا جهت اطلاع از آخرین دوره ها و اخبار سایت در
کانال تلگرام
عضو شوید.
دوره Mega Webflow برای مبتدیان - آموزش ساخت یک وب سایت نمونه کارها از ابتدا در Webflow.
The Mega Webflow Course for Beginners - Learn to build a Portfolio Website from scratch in Webflow.
نکته:
آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:
آیا میخواهید بدون استفاده از یک خط کد، یاد بگیرید که چگونه یک وبسایت کاملاً کاربردی بسازید که طراحی سفارشی، انیمیشنهای دوپ و تعاملات داشته باشد؟
سلام! من Chethan هستم، یک طراح از هند و به دوره Mega Webflow من برای مبتدیان خوش آمدید. در این دوره قصد دارم به شما یاد بدهم که یک وب سایت نمونه کارها یک صفحه ای کاملا کاربردی را از ابتدا در Webflow بسازید. و در پایان، حتی میتوانید با استفاده از دامنه Webflow آن را کاملاً رایگان میزبانی کنید.
من کل وب سایت نمونه کارها را در طراحی کرده ام، که یک ابزار طراحی رابط کاربری رایگان است. برای ساخت وب سایت در Webflow به آن طراحی در Figma اشاره خواهیم کرد.
اوه، به هر حال، از طراحی من به عنوان وب سایت نمونه کار خود استفاده کنید. با آن بازی کنید، چیزهایی را اضافه یا حذف کنید، و آن را متعلق به خودتان کنید. همش مال توست!
محتوای دوره:
درک مفاهیم اساسی توسعه وب.
ساخت کل وب سایت بخش به بخش.
متحرک سازی و افزودن تعاملات برای ایجاد وب سایت بسیار بازیگوش و تعاملی.
بسته بندی وب سایت و آماده سازی آن برای نشان دادن آن به دیگران.
پس امیدوارم که برای شروع بسیار هیجان زده باشید. اگر هستید، من شما را در داخل دوره می بینم!
برای پروژه کلاس، میتوانید وبسایت خود را از ابتدا بسازید یا وبسایت من را قدم به قدم بسازید. اگر می خواهید وب سایت من را تکرار کنید، آیکون ها، تصاویر، رنگ ها و متن را تغییر دهید. همانطور که گفتم، می توانید آن را وب سایت نمونه کارها شخصی خود بسازید.
دارایی ها:
پوشه داراییها باید فونتها، نمادهای تصاویر و فایل Figma را داشته باشد تا هنگام ساخت وبسایت در Webflow به آنها مراجعه کنید.
پیوندهای جریان وب:
: از این پیوند برای ایجاد یک حساب کاربری با Webflow استفاده کنید.
میتوانید به این پروژه Webflow مراجعه کنید، جایی که میتوانید نحوه ساخت وبسایت را ببینید. شما می توانید تمام لایه ها و تنظیمات را در صورتی که در هر جایی گیر کردید بررسی کنید.
وب سایت زنده را با شکوه کاملش مشاهده کنید.
با خیال راحت این وبسایت را در حساب Webflow خود شبیهسازی کنید و از آن به عنوان متعلق به خودتان استفاده کنید.
من را در رسانه های اجتماعی دنبال کنید و کارهای من را بررسی کنید:
منابع دیگر:
Webflow University: با Webflow University نکات و نکات طراحی وب را بیاموزید. آموزش های جامع طراحی و ساخت وب سایت و پاسخ به سوالات متداول را دریافت کنید.
سرفصل ها و درس ها
درس ها
Lessons
افزودن Hover Interactions به نوار پیمایش
Adding Hover Interactions to the Navigation Bar
ساخت بخش تجربه
Building the Experience Section
ایجاد یک دکمه لینک متحرک
Creating an Animated Link Button
ساخت بخش پروژه ها
Building the Projects Section
ساخت بخش Dribble
Building the Dribbble Section
ساخت بخش Tabs
Building the Tabs Section
پاسخگو کردن بخش Tabs
Making the Tabs Section Responsive
ساخت بخش قهرمان
Building the Hero Section
پاسخگو کردن بخش میانی
Making the Middle Section Responsive
پاسخگو کردن بخش مهارت ها
Making the Skills Section Responsive
اطلاعات قیمت گذاری و میزبانی جریان وب
Webflow Pricing & Hosting Information
متحرک سازی بخش مهارت ها
Animating the Skills Section
ایجاد انیمیشن بارگذاری صفحه
Creating a Page Load Animation
متحرک سازی بخش پروژه ها
Animating the Projects Section
ساخت بخش فرم ها
Building the Forms Section
متحرک سازی چرخ فلک لوگو
Animating the Logo Carousal
نحوه استفاده از ایجاد و استفاده از نمادها
How to use create and use Symbols
ریسپانسیو کردن بخش قهرمان
Making the Hero Section Responsive
ایجاد یک تعامل شناور بر روی مولفه پروژه
Creating a Hover Interaction on the Project Component
پاسخگو کردن بخش توصیفات
Making the Testimonials Section Responsive
ساخت نوار ناوبری
Building the Navigation Bar
پاسخگو کردن نوار ناوبری
Making the Navigation Bar Responsive
دانلود دارایی ها و لینک های پیش نمایش
Downloading Assets and Preview Links
افزودن لینک به عناصر پیوند
Adding Links to Link Elements
ایجاد انیمیشن نوار پیشرفت
Creating a Progress Bar Animation
بررسی اجمالی دوره
Course Overview
پاسخگو کردن بخش Dribbble
Making the Dribbble Section Responsive
ساخت بخش گواهینامه ها
Building the Testimonials Section
پاسخگو کردن پاورقی
Making the Footer Responsive
پاسخگو کردن بخش پروژه ها
Making the Projects Section Responsive
ساخت پاورقی
Building the Footer
مبانی وضوح تصویر
Basics of Image Resolutions
متحرک سازی بخش پروژه ها
Animating the Projects Section
درک مدل جعبه
Understanding the Box Model
بعد چه می شود؟
What's Next?
پاسخگو کردن چرخ و فلک لوگو
Making the Logo Carousal Responsive
متحرک سازی بخش تجربه
Animating the Experience Section
پاسخگو کردن بخش تجربه
Making the Experience Section Responsive
ساخت بخش مهارت ها
Building the Skills Section
راه اندازی پروژه جریان وب
Setting up your Webflow Project
ایجاد انیمیشن بخش اسکرول
Creating a Section Scroll Animation
جمع بندی وب سایت
Wrapping up the Website
پاسخگو کردن بخش فرم ها
Making the Forms Section Responsive
سلام، من Chethan هستم. یک طراح از هند. من از حامیان بزرگ جنبش NoCode هستم. برای شخصی که نمی داند چگونه کدنویسی کند، ایجاد وب سایت های کاملاً کاربردی یک رویا است. و Webflow به من کمک می کند تا این کار را انجام دهم. من میخواهم تمام دانش خود را در مورد Webflow به اشتراک بگذارم و به شما اجازه ایجاد وبسایتهای شگفتانگیز از ابتدا و بدون استفاده از یک خط کد را بدهم.
نمایش نظرات