توی جزئیاتش ببین
قالب Dore یه ترکیبی از نهایت خلاقیت یه گرافیست، کدزنی و خود زنی یه برنامه نویس و نهایت تلاش یک ux
کار هست
درسته که قالب اجزا و صفحات زیادی داره ولی سعی کردیم از زبانها و تنولوژی هایی استفاده کنیم که یکسان
باشند
دموی قالب رو ببین حتما ازش خوشت میاد 😊
منوی کلیک راست
برای این گذاشتیم که استفاده ی کامل و حداکثری از قالب بتونین داشته باشید
ویدئو پلیر
با پکیج Video.js کار میکنه و حتی از یوتیوب هم پشتیبانی میکنه
شورتکات صفحه کلید
میانبر های صفحه کلید درست کردیم که هم قابل تنظیمه و هم ux برای کاربرهات بهتر میکنه
منو با دوتا پنل
یه منو با سه تا مرحله، تا هرجا خواستی ازش استفاده کنی و حتی تو ریسپانسیو هم اذیتت نمیکنه
پکیج آیکن Mind
1040 آیکن توی 53 تا مجموعه, طراحیش پیکسلی هست و توی پروژه برای شما قرار دادیم تا هرکدوم دلت خواست استفاده کنی
20 تا تم رنگی
رنگ ها، آیکن ها و طراحی هارمونی که توسط بهترین گرافیستهامون طراحی شدن
4 اپلیکیشن کاربردی
برنامه هایی رو برات قرار دادیم که در زمان یه برنامه نویس بشدت صرفه جویی میکنه
ریسپانسیو قوی و موبایلی
کلاسهای سفارشی بوت استرپ 4 xxs & xxl تجربه های بهتری را برای صفحات کوچک و بزرگ ارائه می دهد
ویژگی ها تو یه نظر
ما قبل از اینکه این قالب رو بنویسیم، به این فکر کردیم که خودمون بعنوان برنامه نویس، چه نیازها و
انتظاراتی از یه قالب مدیرت میتونیم داشته باشیم؟!
بعد همه ی اون مواردی که تهیه کردیم رو بعنوان الویت های اصلی در Dore قرار دادیم
ما دوست داشتیم قالبی که استفاده میکنیم پیچیده نباشه، سرعت عمل خوبی داشته باشه و اجزای اضافی نداشته
باشه که حجم قالب زیاد بشه!
طراحی ساده ولی دلنشین
بعنوان یه برنامه نویس، تجربه ای که دارم اینه که هررررررچقدرم خوب کد بزنی تا وقتی که ظاهر سایتت خوب
نباشه، مشتری یا کاربر متوجه زحمتهات نمیشه!!
طراحی خوب همیشه ضرورت نیست، ولی وقتی محصول نهایی به چشم کاربر یا مشتری، زیبا باشه، انگیزه ی قشنگی
برای ما ایجاد میشه
ناگفته نمونه که ماهم برای اینکه قالب Dore به این حد از محبوبیت برسه زمان زیادی رو برای آیکن ها و
هماهنگی رنگها صرف کردیم
و اولین چیزی که در این پروسه الویت کار خودمون قرار دادیم، ux کاربرهامون بوده


ریسپانسیو میدونی تا کجاست؟
نقطه ی Xxs برای دستگاه های خیلی کوچیکه که کمتر از 420 پیکسل رزولوشن دارند
نقطه ی Xs بین رزولوشن های 420 پیکسل تا 567 پیکسل کار میکنه
نقطه ی Xl برای کامپیوترهای معمولی که رزولوشن بیت 1200 تا 1440 پیکسل دارند کار میکنه
و چیزی که براتون اضافه کردیم نقطه ی Xxl برای صفحه نمایش های بزرگتر با رزولوشن بیش از 1440 پیکسل
کار میکنه
هدف ما از ایجاد این قابلیت های ریسپانسیو این بوده که هم تجربه ی کاربری یا (UX) بهتری رو به
کاربرهامون انتقال بدیم و هم انعطاف استفاده از دستگاه ها رو برای کار با قالب راحت تر کنیم
درباره چارت ها بخونین
یه باور عمومی داریم که میگه استفاده از چارت ها باعث میشه که داده ها و اطلاعاتو راحت تر مجسم کنیم
نمیگم نمودارها بد هستن..! اصلا.. اونها خیلی هم عالی هستن
ولی به نظر من نموداری خوبه که استفاده ازش راحت باشه، هم برای برنامه نویس هم کاربری که قراره اونو
ببینه
باید رنگهاش به قالب بیاد و هماهنگ باشه
نمودار باید ریسپانسیو باشه یا تمام قابلیت هاش قابل تنظیم باشه
میدونی چرا اینا رو میگم؟! چون ما همشو توی Dore داریم 😎
ما فقط از یک پکیج برای ایجاد نمودارها استفاده کردیم و هم سعی کردیم ساده باشند و هم با تمام رنگ
بندی های قالب هماهنگ باشه
میتونین همین الان رنگ تم رو عوض کنین و نمودارها رو در رنگهای دیگه هم ببینید


طرح بندی حتی برای کسب و کار
توی داستان گوگو، یکی از چیزهایی که ما براش در نظر گرفتیم پرسونای کاربرهامون بود. عیعنی ما دوست
داشتیم که بتونیم مخاطبانی که هدف ما هستند بیشتر باشه
مثلا یک نفر یک قالب مینویسه با موضوع فروشگاهی، خب مشخصه مخاطبانی که هدفش هستند کسانی هستند که
تصمیم دارند فروشگاه بسازن
ماهم توی فرآیند ساخت این قالب افرادی رو درنظر گرفتیم که تصمیم دارن از این قالب برای مدیریت کسب و
کار خودشون استفاده کنن
تمام لایوت ها رو طوری درنظر گرفتیم که حتی کاربران با دانش فنی پایین هم بتونن به فهم و درک خوبی از
کارکرد قالب برسند
حتی برای بیزینس های مختلف، طرح های مختلفی قراردادیم.
منوی هوشمند
انصافا بیاین قبول کنیم که توی پنل های مدیریت، دیگه استفاده از منوهای آکاردئونی یه چیز قدیمی و
تکراری شده
بیاین ببینین ما چه کررررررردیم تو گوگو
به جای این تکراری بازی ها و اسکی رفتن ها، ما دوتا پنل ایجاد کردیم و صفحات رو بر اساس اون دسته بندی
کردیم
اسمشو منوی هوشمند گذاشتم؛ چونکه:
- 1. خودتون میتونین تنظیم کنین که کدوم پنلش توی چه سایزی باز یا بسته باشه
- 2. خود منو تشخیص میده توی این سایز ریسپانسیوی که قرار داره، کدوم پنلش رو مخفی کنه یا کدوم رو نمایش بده

ساختار قالب و چیدمان ها
ما همه ی سعی و تلاش خودمون رو کردیم تا اونچه که مخاطبین ما از یه قالب انتظار دارنو برآورده کنیم

منو پیش فرض

زیرمنو مخفی

منو مخفی

لیست عکس

لیست Thumb

دیتا لیست

جزئیات

احراز هویت

نتایج جستجو

اپلیکیشن SPA

دیتا لیست با منو مخفی

تب ها
کامپوننت های قالب
سعی کردیم توی درست کردن اجزا، از حداقل ابزار استفاده کنیم چراکه کم حجم بودن قالب یکی از مولفه های مهم
برای هر برنامه نویسه
میتونم به جرعت بگم که تمام کامپوننت های ما با بوتسترپ 4 همخوانی دارند

رنگ بندی ها
10 تا تم رنگی براتون درست کردیم
حتی اگه از اینها خوشتون نیومد میتونین یه تم رنگی به دلخواه خودتون بسازین چون تمام متغیر های رنگ ها با
Sass ساخته شدن
سرمه ای
آبی المپیک
آبی روشن
سبز سدری
سبز لیمویی
نارنجی
قرمز یاقوتی
بنفش
طوسی
طلایی
تاحالا از تعریفام کیف کردی؟
اگه دوست داری این قالب رو قانونی از ما تهیه کن تا هم به توسعه تیم کمک کرده باشی و هم باعث بشی انگیزه ای برای ما بشه تا محصولات با کیفیت عالی براتون تهیه کنیم