همه‌ی ما می‌دانیم که گاهی اوقات، یافتن ایده‌های جدید و کاربردی به منظور بهبود یا یادگیری یک زبان و فریمورک جدید برنامه نویسی، می‌تواند دشوار باشد.در مقاله قبلی درباره ایده‌های ساخت برنامه برای مبتدیان صحبت کردم؛ در این مقاله برای افرادی که در سطح متوسطی قرار دارند، ایده‌هایی را شرح می‌دهم تا از آن در جهت یادگیری و ارتقا مهارتتان استفاده کنید.
۶.برنامه کتاب‌یاب
برنامه‌ای بسازید که با سرچ کردن موارد مختلف (عنوان، نویسنده، و … ) به کاربران امکان جستجو در کتاب‌ها را بدهد. كتاب‌هایی که پیدا شدند را در یك لیست و در یک صفحه با تمام داده های مربوط به آن نشان دهید.
داستان‌های کاربر (user stories )
- کاربر می‌تواند در یک فیلد ورودی، مواردی را که می‌خواهد جستجو کند.
- کاربر می‌تواند جستجو انجام دهد، سپس یک API فراخوانی میشود که مجموعه ای از کتاب‌ها را با داده‌های مربوط به آن (عنوان، نویسنده، تاریخ انتشار، تصویر و … ) باز می‌گرداند.
- کاربر می‌تواند لیستی از کتاب‌های موجود در صفحه را مشاهده کند.
ویژگی‌های بیشتر
- برای هر مورد در لیست یک لینک اضافه کنید این لینک کاربر را به یک سایت خارجی ارسال می‌کند؛ که اطلاعات بیشتری در مورد کتاب دارد.
- طراحی انجام شده ریسپانسیو باشد.
- انیمیشن‌هایی را برای زمان بارگیری اضافه کنید.
لینک‌ها و منابع مفید
- شما می‌توانید از Google Books API استفاده کنید.
نمونه پرو‌ژه‌ها
۷. بازی کارت حافظه
بازی کارت حافظه به این صورت است که باید روی یک کارت کلیک کنید تا ببینید چه تصویری زیر آن قرار دارد؛ سپس کارتی را که با آن تصویر همخوانی دارد پیدا کرده و روی آن کلیک می‌کنید.(البته باید روی کارت‌ها کلیک کنید تا بفهمید چه کارتیه).
داستان‌های کاربر (user stories )
- کاربر می‌تواند یک صفحه با n x n کارت را ببیند(n یک عدد صحیح است). در ابتدا همه‌ی کارت‌ها به پشت هستند(حالت مخفی).
- کاربر می‌تواند برای شروع بازی روی یک دکمه کلیک کند. با کلیک بر روی این دکمه ، یک تایمر شروع به کار می‌کند.
- کاربر می‌تواند برای رونمایی از تصویری که در زیر کارت قرار دارد ، روی هر کارت کلیک کند (آن را به حالت قابل مشاهده تغییر دهد). تصویر تا زمانی که کاربر روی کارت ۲ کلیک کند، نمایش داده میشود.
هنگامی که کاربر روی کارت ۲ کلیک می‌کند: - اگر کارت‌ها با هم همخوانی داشته باشند، 2 کارت از بازی حذف میشود (یا آن‌ها را پنهان کنید یا حذف کنید یا آن‌ها را در حالت مرئی قرار دهید).
- اگر کارت‌ها باهم همخوانی نداشته باشند، 2 کارت به حالت اصلی خود(حالت پنهان) بر می‌گردند.
- هنگامی که همه‌ی کارت‌ها با هم مَچ شدند، کاربر می‌تواند یک کادر حاوی پیام تبریک را مشاهد کند؛ همچنین زمانی که طول کشیده تا بازی به پایان برسد را هم می‌تواند مشاهده کند.
ویژگی‌های بیشتر
- بازی می‌تواند در چندین سطح (آسان، متوسط، سخت) باشد و کاربر یکی از آن‌ها را انتخاب کند. افزایش دشواری به معنای: کاهش زمان برای تکمیل بازی و یا افزایش تعداد کارت است.
- کاربر می تواند آمار بازی را ببیند (تعداد دفعاتی که او برنده شده/بازنده شده، بهترین و بالاترین زمان برای هرسطح)
لینک‌ها و منابع مفید
نمونه پرو‌ژه‌ها
۸. برنامه نقاشی
یک بوم نقاشی دیجیتالی بسازید تا هم بتوانید از نقاشی‌هایی که در آن کشیده میشود خروجی بگیرید و هم بتوانید آن را در شبکه‌های اجتماعی به اشتراک بگذارید.
داستان‌های کاربر (user stories )
- کاربر می‌تواند با استفاده از ماوس، روی بوم نقاشی کند.
- کاربر می‌تواند رنگ را تغییر دهد.
- کاربر می‌تواند اندازه ابزار را تغییر دهد.
- کاربر می‌تواند یک دکمه را برای پاک کردن طرح روی بوم، فشار دهد.
ویژگی‌های بیشتر
- کاربر می‌تواند نقاشی خود را به عنوان تصویر ذخیره کند (قالب .png ، .jpg ، و … ).
- کاربر می‌تواند اشکال مختلف (مستطیل، دایره، ستاره، و … ) ترسیم کند.
- کاربر می‌تواند آثار خود را در رسانه های اجتماعی به اشتراک بگذارد.
لینک‌ها و منابع مفید
بیاموزید که چگونه با استفاده از p5js ، یک برنامه طراحی بسازید.
نمونه پرو‌ژه‌ها
۹. فروشگاه اینترنتی ساده
هدف یک فروشگاه اینترنتی ساده این است، که به کاربران امکان انتخاب محصول برای خرید، مشاهده اطلاعات خرید، افزودن آن به سبد خرید آنلاین و در آخر خرید آن محصول با کارت بانکی، را بدهد.
محدودیت‌ها
- در صورت توسعه با جاوااسکریپت، می‌توانید موجودی محصول خود را به عنوان مجموعه ای از آرایه‌های جاوااسکریپت پیاده‌سازی کنید. برای زبان‌های دیگر از هر راه‌حلی که بهینه است و با آن احساس راحتی می‌کنید استفاده کنید.
داستان‌های کاربر (user stories )
- کاربر می‌تواند برای مشاهده صفحه محصولات ، روی دکمه "مشاهده محصولات" در صفحه Landing کلیک کند.
- کاربر می‌تواند یک کارت را در صفحه محصولات برای هر محصول مشاهده کند؛ که نشانگر محصول، نام، قیمت، توضیحات کوتاه و دکمه‌ی "انتخاب" است.
- کاربر می‌تواند هنگامی که روی دکمه‌ی "انتخاب" کلیک می‌کند، یک صفحه از جزئیات محصول را مشاهده کند که همان اطلاعات کارت محصول را نشان می‌دهد، اما یک شناسه محصول منحصر به فرد، توضیحات طولانی‌تر ، دکمه‌ی "افزودن به سبد خرید" و "مشاهده محصولات بیشتر" را هم نشان می دهد.
- کاربر می‌تواند هنگام اضافه شدن محصول به سبد خرید، پیام تأیید را مشاهده کند.
- کاربر می‌تواند برای بازگشت به صفحه محصولات، روی صفحه «مشاهده محصولات بیشتر» کلیک کند.
- کاربر می تواند دکمه "سبد خرید" را در صفحه Landing یا صفحه محصولات مشاهده کند.
- کاربر می‌تواند بر روی دکمه‌ی "سبد خرید" کلیک کند تا صفحه سبد خرید شامل شناسه محصول، نام، قیمت و مقدار محصول سفارش داده شده که قبلاً برای هر محصولی که به سبد خرید اضافه شده را مشاهده کند.
- کاربر می‌تواند مبلغ خرید کل را در کارت خرید مشاهده کند که به عنوان مبلغ کمیت‌های ضرب شده با قیمت واحد برای هر کالای سفارش داده شده محاسبه می شود.
- کاربر می‌تواند مقدار تنظیم شده برای هر محصول را تنظیم کند تا مبلغ کل خرید را تنظیم کند.
- کاربر می‌تواند بر روی دکمه "تکمیل خرید" در صفحه سبد خرید کلیک کند تا سفارش را تکمیل کند. کاربر می تواند برای لغو سفارش بر روی دکمه "لغو سفارش" در صفحه سبد خرید کلیک کند و سپس کل مبلغ و مقدار محصول به صفر می‌رسد.
- کاربر می تواند بر روی دکمه "مشاهده محصولات بیشتر" در صفحه سبد خرید کلیک کند تا به صفحه محصولات برگردد.
ویژگی‌های بیشتر
- اگر مقدار سفارش داده شده از مقدار "موجود" محصول فراتر برود، کاربر پیام خطایی را مشاهده کند.
- کاربر می‌تواند هزینه حمل و نقل اضافه شده به کل مبلغ خرید را مشاهده کند.
- کاربر می‌تواند مالیات فروش اضافه شده به کل مبلغ خرید را مشاهده کن.
- توسعه‌دهنده، موجودی محصول را در یک فایل خارجی یا یک پایگاه‌داده پیاده‌سازی می‌کند.
لینک‌ها و منابع مفید
- سایت‌های بسیاری برای تجارت الکترونیکی وجود دارد. می توانید از Dribbble و Behance برای الهام گرفتن استفاده کنید.
نمونه پرو‌ژه‌ها
۱۰. برنامه To Do List (لیست کارهایی که می‌خواهیم انجام بدهیم)
برنامه کلاسیک To-Do که در آن کاربر می‌تواند تمام کارهایی را که می‌خواهد انجام دهد را بنویسد.
داستان‌های کاربر (user stories )
- کاربر می‌تواند یک فیلد ورودی ببیند، که در آن یک مورد از کارهایی که می‌خواهد انجام دهد را تایپ کند.
- با فشار دادنenter (یا یک دکمه)، کاربر می‌تواند یک مورد را ثبت کند و مشاهده کند که آن به لیست کارهای انجام شده اضافه میشود.
- کاربر می‌تواند کاری را که تکمیل کرده، علامت‌گذاری کند.
- کاربر می‌تواند با فشار دادن یک دکمه (یا یکی از موارد) یک مورد را انجام دهد.
ویژگی‌های بیشتر
- کاربر می‌تواند لیستی از تمام کارهای انجام شده را مشاهده کند.
- کاربر می‌تواند لیستی با همه کارهای فعال ( در حال انجام ) را مشاهده کند.
- کاربر می‌تواند تاریخ ایجاد کار را ببیند.
- با بستن پنجره مرورگر، کارهای انجام شده ذخیره می‌شوند و با بازگشت کاربر، داده‌ها بازیابی می‌شوند.
لینک‌ها و منابع مفید
نمونه پرو‌ژه‌ها
ادامه‌ی این پست (بخش سوم) در مقاله‌ی دیگری منتشر میشود.
دیدگاه و پرسش
در حال دریافت نظرات از سرور، لطفا منتظر بمانید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید