تجربه: 3

سن: 18 الی 30

محدوده حقوق و دستمزد: قابل مذاکره

جای خالی: 1

طبیعت شغلی : پیمانی

تاریخ ارسال : 2025.12.31

آخرین تاریخ : 2026.01.28

هدف

اضافه کردن یک بخش جدید با عنوان «پادکست» در صفحه راهنمای جامع، با طراحی نسخه لایت و قابل نمایش ریسپانسیو برای موبایل و دسکتاپ. کاربران باید بتوانند مجموعه پادکست‌ها را مرور، انتخاب و پخش کنند. طراحی باید ساده، سبک و هماهنگ با سبک بصری صفحه راهنمای جامع باشد.

---

محدوده طراحی

۱. بخش «پادکست»

• عنوان بخش: پادکست

• توضیح کوتاه بالای بخش: معرفی هدف و محتوا (مثلاً «مجموعه‌ای از پادکست‌های آموزشی، خبری و تخصصی متارنگ»)

• امکان مرور چند پادکست به‌صورت کارت‌های سبک و لایت

• هر کارت پادکست شامل:

  • تصویر شاخص یا کاور پادکست

  • عنوان پادکست

  • خلاصه کوتاه (حداکثر 2-3 خط)

  • مدت زمان هر قسمت

  • دکمه پخش/مشاهده جزئیات

۲. حالت‌های کارت‌ها

• حالت عادی (Normal)

• حالت هاور (Hover) با نمایش اطلاعات بیشتر یا دکمه پخش

• حالت انتخاب شده/فعال (Active) برای پادکستی که در حال پخش است

۳. ساختار و ناوبری

• امکان پیمایش افقی (Carousel) یا شبکه‌ای (Grid) برای مرور چندین پادکست

• طراحی ریسپانسیو برای موبایل و دسکتاپ

• نمایش تعداد قسمت‌ها و ترتیب پخش (اختیاری)

• دکمه مشاهده جزئیات هر پادکست و لیست اپیزودها

۴. تعامل و وضعیت‌ها

• پیش‌نمایش پادکست با پلیر ساده

• نمایش وضعیت پخش: در حال پخش، متوقف، دانلود شده

• انیمیشن‌های سبک برای حالت هاور یا پخش

۵. هماهنگی بصری

• طراحی سبک (Light) با پس‌زمینه روشن و حداقل المان‌های اضافی

• فونت، رنگ و کامپوننت‌ها هماهنگ با سبک صفحه راهنمای جامع

• فضای سفید کافی برای خوانایی

• کارت‌ها و دکمه‌ها به‌صورت کامپوننت فیگما قابل استفاده مجدد طراحی شوند

---

خروجی مورد انتظار

• فایل فیگما با بخش «پادکست» نسخه لایت کامل، شامل:

  • Layout Grid یا Carousel

  • کارت‌های پادکست با تمامی المان‌ها

  • دکمه‌ها و وضعیت‌های مختلف

  • طراحی ریسپانسیو برای موبایل و دسکتاپ

  • توضیحات کوتاه متنی برای دیزاینر و توسعه‌دهنده

------------------------------------------------------------------------------------------------------------------
منابع تسک:

صفحه راهنمای جامع
https://rgb.irpsc.com/fa/education

سیستم دیزاین:
https://www.figma.com/file/Dg7lPOkltk0TKlUgpKYWYs/Modal-design?type=design&mode=design&t=ExpWbgrrSM209STH-0