بروز خطا
   [message]
اشتراک در سوال
رای ها
[dataList]
پرسش و پاسخ

آموزش ویدئویی طراحی رابط کاربری در فتوشاپ (آموزش طراحی رابط کاربری بازی و ریاضی اضافه شد)

مشاهده پاسخ‌ها 4
مدیریت گفتگو
Programmer 12 سال پیش
آخرین تغییر: 10 سال پیش

سلام دوستان
از اونجایی که طراحی رابط کاربری نقش بسیار زیادی در زیبایی برنامه های اندرویدی  داره و متاسفانه امروز شاهد رابط کاربری های بسیار ضعیف در اغلب برنامه های ایرانی هستیم قصد دارم سری آموزش های ویدئویی رو تقدیم به شما دوستان بکنم که در اون میتونیم طراحی رابط کاربری بوسیله فتوشاپ رو در قالب پروژه  یاد بگیریم.

مطالبی که در این سری از آموزش ها گفته میشه حتما دارای تعداد بسیاری غلط های علمی و... هست.چون بنده فقط به دلیل علاقه ای که داشتم به دنبال یادگیری این موضوعات رفته ام و دوست داشتم که این اطلاعات اندکم رو با شما به اشتراک بزارم و هرگز تخصص خاصی در این زمینه ندارم.تنها هدف من کمک به دوستان برای داشتن یک برنامه زیباست.

  • دوستان خواهشا از درج پاسخ در این تاپیک خودداری کنید تا تاپیک از نظم خاصی برخوردار باشه
  • برای تشکر از دکمه "لایک" استفاده کنید
  • برای انتقال انتقاد، پیشنهاد و یا درخواست تدوین ویدئو از قسمت درج نظر استفاده کنید
  • آموزش ها به تدریج اضافه میشن.پس با مشترک شدن در این تاپیک از آپدیت های بعدی مطلع شوید
  • برای اطلاعات بیشتر درباره گرافیک و طراحی رابط کاربری حتما این تاپیک رو مطالعه فرمایید
  • پیشنهاد میشود برای تماشای ویدئو ها از نرم افزار KmPlayer استفاده کنید.

نکته : هر یک از دوستان که توانایی اش رو داره لطفا در مستقیم کردن لینک ها همکاری کنه.

با تشکر - مهدی خسروی

نظرات

Spirit 12 سال پیش
لطف میکنید واقعاً :) - مشترکـ
Dadparvar 12 سال پیش
ضمن تشکر. برای مستقیم کردن لینکها توسط خود شما بمنظور راحتی در درج//answers.uncocoder.com/question/3065
Programmer 12 سال پیش
ممنون از دوستان.اقای عظیمی تا اونجایی که بنده اطلاع دارم آپلود سنتر شما تا حداکثر حجم 64 مگابایت رو اجازه آپلود میده.شاید چند فایل اول آموزشی به این حجم نرسه ولی قسمت های آینده حتما بیشتر از 64 مگابایت حجم خواهد داشت !
Dadparvar 12 سال پیش
کلا چند فایل خواهد بود؟ و مجموعا چقدر حجم نیاز خواهد بود؟
Programmer 12 سال پیش
خودم هم نمیدونم.چون این آموزش ها سرفصل های دقیق ندارند.چندین ui مختلف در چندین قسمت آموزش داده میشوند !
Dadparvar 12 سال پیش
چنانچه آموزش ها از کیفیت مطلوبی برخوردار باشند تا سقف یک و حتی دو گیگ میتونید روی آپلودسنتر بنده حساب کنید (بعید میدونم از این حد بالاتر بره.درسته؟)
Programmer 12 سال پیش
خیلی ممنون از لطف شما.خیلی هم عالی.نه فکر نمیکنم حتی به یک گیگ برسه !
Dadparvar 12 سال پیش
تاهرقسمت که زیر 64 مگ بود خودتون درج کنید و هرجا بقسمتی رسیدید که بیشتر بود بمن پیام بدید تا انجام بدیم
SaLaH KuRD 12 سال پیش
بسیار عالی - مشترک !
مجتبی یگانه 12 سال پیش
مشترک + یا خاطره ! ، من یه بار میخواسم واسه یه دوستی 20 دقیقه ویدئو ظبط کنم ، که توضیح انجام کاری بود ، تو این 20 دقیقه حداقل 20 تا دوره گرد ، انواع و اقسام محصول رو برای فروش به محله ما آورد ! ،یعنی بعضی از محصولات رو تا حالا ندیده بود :)) احتمالا از خارج آورده بود ! ، بعد حالا به من بگن ، برو گوجه بخر ، باید 30 کیلومتر پیاده روی کنم :| ، واقعا خسته نباشید ، کار طاقت فرسایی هست
Programmer 12 سال پیش
ممنون از نظر همه دوستان.ما هم از این چیزا داریم.ولی با بستن پنجره و روشن کردن پنکه سعی میکنم که صداهای زائد رو کم کنم.اینا هم حل بشه مشکل سوتی های خودم رو نمیدونم چکار کنم، خیلی افتضاحن ! (اقا شما که مدیری پیگیر باش که اگه دوستی پاسخی درج کردن پاکش کنی که نظم اینجا از بین نره ممنون)
***ali*** 12 سال پیش
واقعا عالی بود ، لطفا ادامه بدید.
Ghost 12 سال پیش
داداش با اینکه یکماه از این تاپیک میگذره ولی خداییش عالی بود!دست درد نکنه

پاسخ‌ها 4

Programmer 12 سال پیش

*طراحی رابط کاربری یک کتاب در فتوشاپ *
دیدن نتیجه نهایی این دوره

- مــــــــــــــــــقــــــــــــــــــــدمــــــــــــه ایــــــــــن ســــــــــری آمـــــــــــوزشـــــــــــی | لینک  
- مــــــــــــقــــــــدمـــــات کــــــار بــــا ابــــــــزار هـــــا در فــــــتــــــوشــــاپ | لینک 
- طراحی UI کتاب قسمت اول : مقدمه طراحی صفحه اصلی | لینک 
- طراحی UI کتاب قسمت دوم : زیــبــا سـازی صـفـحه اصـلــی | لینک 
- طراحی UI کتاب قسمت سوم : طراحی صفحه خروج برنامه | لینک 
- طراحی UI کتاب قسمت چهارم : طراحی صفحه دربــاره مــا | لینک 
- طراحی UI کتاب قسمت پنجم : طراحی صفـحه تــنــظـیـمـات | لینک 
- طراحی UI کتاب قسمت ششم : طـراحی صفـحهمتـن کـتـاب | لینک 
- طراحی UI کتاب قسمت هفتم : طــــراحــــی Sliding Menu | لینک 
- طراحی UI کتاب قسمت هشتم : ســـــورس هــای ایــن پـــروژه | لینک 

نظرات

Programmer 12 سال پیش
چه خطایی بهتون میده ؟ تا دقایقی دیگه لینک های کمکی MediaFire رو قرار میدم
سالار جلالی 12 سال پیش
حل شد داداش .مشکل از سمت من بود.آموزشای خوبو به درد بخوری خیلی ممنون.
Astro 12 سال پیش
کار شما ستودنی هست . همین روشی هم که آموزش میدید عالیه
Programmer 12 سال پیش
لینک های کمکی MediaFire اضافه شد.دوستان اگر مشکلی در لینک ها بود لطفا اعلام کنید.ممنون
MEHDI007 12 سال پیش
خیلی ممنون
MEHDI007 12 سال پیش
فقط یک مشکلی داره که صداش خیلی کمه من صدا رو تا ته بردم صدا به زور به گوش میرسه!
Programmer 12 سال پیش
اها.ممنون از نظر شما.این مورد از این به بعد در ویدئو های بعدی اصلاح خواهد شد.در تمامی ویدئو ها این مشکل وجود داره ؟
MEHDI007 12 سال پیش
ویدئو اول و دوم و سوم که همین جور بود !
Programmer 12 سال پیش
کم بودن صداهارو قبول دارم.بهش دقت نکرده بودم.ولی اگه با KmPlayer تماشا کنید کیفیت بهتری رو خواهید داشت !
MEHDI007 12 سال پیش
با برنامهkmplayerصدا درست هست خیلی ممنون.
Aref 12 سال پیش
خسته نباشید من یک آموزش 30 دقیقه ای شبکه درست کردم یک روز وقتم رو گرفت اینقدر با مشکل مواجه میشدم :)) ، آموزش های خوبی بود امیدوارم که با آموزش هایی که میذارین گرافیک برنامه هامون بهتر شه و از این نظر دیگه هیچ مشکلی نداشته باشیم ، و یک پیشنهاد : برای طراحیتون فونت yekan قشنگ تر میشه و دکمه های سه بعدی با سایه هم دیگه چندان طرفداری نداره ، هر چند که flat هم از مد افتاده ولی تو ایران هنوز استقبال خوبی ازش میشه ، اگه کلاً سبک فلت آموزش بدین خیلی بهتره و میتونین چند UI حرفه ای انتخاب کنین و نحوه ساخت اونها رو آموزش بدین و نیازی نیست حتماً ایده از خودتون باشه مثلاً طراحیهای خود گوگل
***ali*** 12 سال پیش
اگر فلت از مد افتاده پس بعد چه روشی از فلت بهتره؟
سامان پاپی 12 سال پیش
کار بسیار خوبی خدا کمک کنه ما هم به سطح هایی برسیم بتونیم کمک کنیم
maysammortazi 12 سال پیش
آموزشای خوبی بودن ممنون
سامان پاپی 12 سال پیش
ضعف خیلی بزرگ که مطمئن هستم اقای خسروی بر طرف یکنن اینهکه این ها رو بیار توی اکلیپس و توی اپ اندرویید نمایش بدن تا کامل بشه اموزش ها خیلی خیلی ممنون
Programmer 12 سال پیش
@Amirahmad Adibi : متاسفانه برای اونکار فعلا سواد کافی رو ندارم...اگه در آینده تونستم که همچین کاری بکنم حتما از مراحلش فیلم برداری میکنم و در اینجا قرار میدم
mf2010 12 سال پیش
خیلی خیلی عالی بود عاغا ویدویو های جدید کی میاد ؟
Programmer 12 سال پیش
3 ویدئو آموزشی جدید + سورس پروژه ui کتاب اندروید اضافه شد !
Astro 12 سال پیش
یک سوال داشتم . این ها رو ما در فوتوشاپ طراحی کردیم حالا چطور وارد برنامه و eclipse کنیم؟ باید تک تک عناصر رو export کنیم و در Eclipse بسازیم؟مثلا در صفحه اصلی تمام دکمه ها رو تک تک export کنیم؟
Programmer 12 سال پیش
@xuvi : نمیدونم والا.من خودم برنامه نویسی اندروید خیلی مبتدی هستم (بخش 4 - شی گرائی) و هنوز نمیدونم چطور باید این طراحی هارو وارد Eclipse کنیم !
Aref 12 سال پیش
این لینک رو یه نگاه بندازین //sallar.me/1393/02/13/web-design-trends/#more-1217
احسان منصوری 12 سال پیش
xuvi عزیز، کار زیاد سختی نیست. فقط لایه بندیه. شما UI رو که توی فتوشاپ طراحی کردین تیکه تیکه اونو توی اکلیپس پیادش کنید. فقط سختی کارش Layoutهاش هست. اگه خواستید و آقای خسروی اجازه دادن، یکی از کارهاشونو توی اکلیپس میسازیم.
Astro 12 سال پیش
تشکر .آهان پس از طریق همون layout ها و به صورت دستی هستش. فکر کردم روش ساده تری وجود داره که طرح رو یکجا وارد eclipse کرد و خودش لایه بندی ها و... رو انجام بده. پس در واقع این فقط یه طرح برای ذهنیت خودمونه .
***ali*** 12 سال پیش
ولی باید در سایز 720 * 960 طراحی بشه استاد گفتند . و سایز xhdpi هست.
***ali*** 12 سال پیش
عارف جان ممنون لینک جالبی بود.
احسان منصوری 12 سال پیش
اصلا فتوشاپ و اکلیپس ربطی به هم ندارن:) همین که شما گفتین درسته و یه ذهنیت توی فتوشاپ براتون درست میشه
Programmer 12 سال پیش
احسان منصوری : اقا منصوری این چه حرفیه.آموزش ها متعلق به شماست.هر بلایی که میخواید سر آموزش ها بیارید بیارید.
***ali*** 12 سال پیش
من تو سایز 720*960 ui رو میسازم بعد داخل drawable-xhdpi میذارمش.
Programmer 12 سال پیش
Alex1 : بله درسته. دوستان با طراحی ui در سایز 480 * 800 مشکلی دارین ؟ اگه بله از این به بعد در سایز 720 * 960 آموزش هارو ادامه بدیم ؟
***ali*** 12 سال پیش
نه این زیاد مهم نیست
***ali*** 12 سال پیش
آقا احسان درست می فرمایند.
mf2010 12 سال پیش
عاغا یعنی خیلی خیلی دمت گرم کلا با دیدن ویدیو های شما گرافیکم متحول شد خواهشا ادامه بده
***ali*** 12 سال پیش
نظرات چرا سیاه میشن ؟
MILAD-MB 12 سال پیش
alex1 دوست عزیز بخاطر اینکه نظراتی که شما دادید اسپم می باشد. اگه متوجه شده باشید در مورد این موضوع یک تاپیک ساخته شده و در مورد آن توضیح داده شده. به قسمت پرسش و پاسخ برید و اون تاپیک رو مطالعه کنید. ممنون
علی تاتار 12 سال پیش
اقای خسروی ممنون از اموزش هاتون.اگه لطف کنید یک جای دیگه اپلودش کنید خیلی خوب میشه چون این سایت فعلی باید چند مرحله رد کنی تا فایل دانلود بشه.ممنون
Programmer 12 سال پیش
علی تاتار : خواهد میکنم دوست عزیز.اگه مشکل هست میتونید از لینک های کمکی Mediafire استفاده کنید.متاسفانه فعلا جای دیگه ای برای آپلود فایل ها ندارم...
Programmer 12 سال پیش
دوستان لینک های مستقیم هم اضافه شد.اگه دوست دارید از اخرین تغییرات تاپیک و آموزش های جدید مطلع شوید خود را در تاپیک مشترک کنید.ممنون
ho_ghorbani 12 سال پیش
خسته نباشید واقعا کار سختی رو دارید انجام میدید به قول قدیمی ها خدا قوت
Borhani 12 سال پیش
سلام آموزشها رو دیدم بهتر است آموزشهایت رو با تولید در خود اکلیپس تکمیل کنید که قابلیت اجرایی این شکل از گرافیک در نرم افزار دیده شود.
Programmer 12 سال پیش
ممنون از همگی دوستان بخاطر لطفی که دارن.در بالاتر گفتم.سواد کافی برای اجرای این گرافیک ها در محیط اکلیپس رو ندارم
***ali*** 12 سال پیش
اینها هم یه سری فایل psd برای طراحی ui : لینک
سپهر 12 سال پیش
اگر از ui های طراحی شده عکسی هم باشه در تاپیک ملموس تر خواهد شد
سپهر 12 سال پیش
اگر از ui های طراحی شده عکسی هم باشه در تاپیک ملموس تر خواهد شد
Programmer 12 سال پیش
sepehr70 : خیلی ممنون بخاطر پیشنهاد.ترتیب اثر داده شد !
aliakbar333 12 سال پیش
مهدی جان ممنون. اگه بتونی کیفیت صدای کلیپ هات رو بالاتر ببری قطعا کیفیت کارت هم بالاتر میره.
Programmer 12 سال پیش
خیلی دوست دارم آموزش هارو با کیفیت 720 بزارم ولی به طبع همچین کیفیتی حجم ویدئو رو بالا میبره و برای بنده با این سرعت اینترنت (!) اپلود ویدئوهای باکیفیت کاری سخت خواهد بود.دیگه به بزرگی خودتون ببخشید
Eminent 12 سال پیش
عالی دوست عزیزم خیلی کوتاه و مفید داری میگی خوشمان آمد
Ghost 11 سال پیش
ببخشید دوستان من تمام اینارو ساختم فقط چجوری توی یک لایه ازش استفاده کنم؟
Mostafadam1 11 سال پیش
خیلی عالی بود واقعا دمت گرم. کاش یکی از دوستان که برنامه نویسی خوبی دارند هم این بخش رو همراهی کنن و انتقال به اکلیپس رو هم توضیح بدن
Mostafadam1 11 سال پیش
با اجازه ی آقای خسروی من دارم همین طرح ایشون رو داخل اکلیپس پیاده می کنم واسه پروژه کتاب. صفحه اصلی و خروجش رو انجام دادم. یه نکته که توی طراحی ها اگه آقا مهدی اضافه میکرد خوب بود اینه که واسه هر دکمه باید دو حالت طراحی بشه یکی حالت ثابت و یکی هم زمانی که لمس انجام میشه. من خودم این موارد رو طراحی کردم.
سامان پاپی 12 سال پیش

سلام دوستان با جازه از اساتید و اقای خسروی اموزش استفاده از منباع توی اکلیبس رو میزارم من از این روش استفاده میکنم و مطمن نیستم درست باشه اگه اشتباهی نکته ایی  هست ممنون میشم فید بکتون رو بگید

من خودم پروژه هایی که میزنم با این روش کار میکنم و فکر نکنم روش استانداردی باشه حتما مشکلات خطاهایی داره

دانلود کنید

نظرات

احسان منصوری 12 سال پیش
خوب بود امیراحمد جان. فقط واسه ذخیره عکس ها، فرمت PNG برای عکس هایی استفاده میشه که بکگراندشون Transparent هستن. میتونی از JPG استفاده کنی. موفق باشی عزیز
MEHDI007 12 سال پیش
خوب بود ولی نمی دونم چرا به نظر من خیلی خیلی مبتدی بود:)ولی خوب بود
سامان پاپی 12 سال پیش
مهدی جان گفتم من خیلی خیلی مبتدی ام تو فیلم هم چند بار گفتم
Mir Unknown 12 سال پیش
فایل از اپلود سنتر حذف شده!
سامان پاپی 12 سال پیش
بله . متاسفانه کاریشم نمیشه کرد یادم میاد اموزش خاصی نبود خیلی خیلی سطح شما بالاتر هست این فیلم . این کلیپ مال مبتدی ها بود. ممنون
Programmer 12 سال پیش
دوستان چون آموزش ارزشمندی بود و دوستمون اقای ادیبی براش زحمت کشیده بودن، من فایل رو که در لیست دانلود هام داشتم پیدا کردم و دوباره اپلودش کردم.اگه اقای ادیبی لطف کنن و لینک جدید رو جایگزین کنن ممنون میشم : لینک
سامان پاپی 12 سال پیش
ممنون از اقای خسروی . متاسفانه من به خاطر درسا و اموزش های جدید اندروید خیلی خیلی خیلی شلوغه . شرمنده
Programmer 12 سال پیش

* آموزش ویدئویی طراحی رابط کاربری اپ اطلاع در فتوشاپ *
کاری از آقایان امین شیخی و حسین کرد
دیدن نتیجه نهایی این دوره

- قسمت اول : طـــــــراحــــــی صـــــــفـــــحــه ثـبـت نام | لینک 
- قسمت دوم : طـــــراحــــــــی صـــفــــــــحــــــــــــه ورود | لینک 
- قسمت سوم : طـــــراحـــی صـــفحــه اصـــــلی و منو | لینک 
- قسمت چهارم : طراحی صفحه اطلاعات شخصی| لینک 

نظرات

Programmer 12 سال پیش
دوستان آموزش های طراحی رابط کاربری اپ اطلاع به صورت کامل اضافه شد.برای مطلع شدن از آموزش های بعدی در تاپیک مشترک شوید.سورس پروژه هم داخل هر قسمت به صورت جداگانه قرار گرفته.ممنون.بزودی : آموزش کامل طراحی رابط کاربری اپ "بازی و ریاضی" کاری از اقای رضا عزیزی ! ( لینک )
MEHDI007 12 سال پیش
سختی کار اون جاست که پروژ رو وارد eclipseکنی.اما واقعا اموزش هاتون خیلی خوبه.ممنون
سپهر 12 سال پیش
چطور میشه این طراحی ها رو وارد eclpise کرد ؟ آموزشی برای این کار وجود داره ؟
Programmer 12 سال پیش
@سپهر : میتونید از آموزش های دوست خوبمون اقا صلاح استفاده کنید : لینک
ابراهیم 10 سال پیش
اموزش قسمت چهار بر خلاف سایر قسمت ها لینک کمکی دوم اش در مدیا فایر نیست و حذف شده اگر ممکن است دوستان ان را مجددا اپلود کنند.
Programmer 12 سال پیش

* آموزش ویدئویی طراحی رابط کاربری بازی و ریاضی در فتوشاپ *
کاری از اقای رضا عزیزی
... قسمت های بعدی بزودی ...

- قسمت اول : طراحی صفحه اصلی | دانلود با لینک مستقیم -

نظرات

Programmer 12 سال پیش
دوستان اموزش طراحی رابط کاربری بازی و ریاضی ( لینک ) قسمت اول اماده شد !قسمت های بعدی بزودی ...
Pr0gramm3r 12 سال پیش
داداش ممنون بابت زحمتات , ولی تا وقتی ندونیم چطوری به خود اپ اضافش کنیم چه فایده داره؟
Programmer 12 سال پیش
میتونید از خود توسعه دهنده کمک بگیرید.تو گوگل سرچ کنید.تو همین سایت سوال بپرسید.از تاپیک های مرتبط استفاده کنید(مخصوصا آموزش های اقای صلاح کرد).اقای عزیزی از صفر شروع کردن و تونستن همچین رابط کاربری رو پیاده کنن.پس کار غیرممکنی نیست و شما هم میتونید انجامش بدید
miladint 12 سال پیش
مهدی جان تشکر بابت زحمات زیادت عالی هست کاری که انجام میدی، میلاد جان وقتی psd آماده باشه دیگه آب خوردن هست انگار لقمه رو میذارن دهن کسی، شما با آموزشایی که استاد دادن کافیه اینارو تک تک وارد کنی مثلا اول بکگراندشو بعدش مثلا تک تک دکمه ها با جاشون که کجانو که دیگه میدونی چجوری، همین و اضافه کنم آموزش وارد کردن هم صلاح جان دارن انجام میدن ، موفق باشین
Pr0gramm3r 12 سال پیش
ممنون بابت توضیحات , ولی بعضی از کنترل ها سخته کمی , مثلا باتن که خیلی راحته , اما seekbar و progressbar .... , راستی اقای مهدی خسروی ممنون میشم پیاماتون رو چک کنید
MEHDI007 12 سال پیش
خوب بود ولی اگه یه نفر پیدا می شد بیاد همین منابع رو وارد eclipceکونه خیلی خوب میشد.خیلی ممنون اموزش خوبی بود.
***ali*** 12 سال پیش
برای سیک بار من تونستم بذارم تو برنامم. سختی خاصی نداره .یه فایل خیلی کوچک و ناین پچ شده است که وارد اکلیپس میشه .و یه سری property برای اینکه عکسا رو روی سیک بار ست کنی هست. که سادس به نظرم . لینک
StackOverMind 11 سال پیش
اقای خسروی اموزشو تکمیل نمیکنید؟؟؟؟
احمد اسدی 11 سال پیش
مهدی جان؛ چطور این قالب هایی که ساختیم رو توی برناممون پیاده کنیم ؟
Programmer 11 سال پیش
دوستان ببخشید اگه دیر شد.ادامه ی آموزش هم چیز خاصی نداره.ولی بزودی حتما میزارم بقیشو.این رو که چجوری پیادش کنیم رو بلد نیستم متاسفانه
حامد 11 سال پیش
مهدی جان ادامه نمیدی؟
Programmer 11 سال پیش
بله بله بزودي.اينقدر درگير آموزش ها هستيم وقتي نمونه.چشم
Android Dev 11 سال پیش
ممنون اقای خسروی! ادامه اموزش را کی قرار میدید؟
alisherafat01 11 سال پیش
تاپیک تعطیل شد؟ خیلی وقته ادامه ندادید
amin_313 10 سال پیش
جناب خسروی دیگه ادامه نمیدین؟ :(
پاسخگویی و مشاهده پاسخ های این سوال تنها برای اعضای ویژه سایت امکان پذیر است .
چنانچه تمایل دارید به همه بخش ها دسترسی داشته باشید میتوانید از این بخش لایسنس این آموزش را خریداری نمایید .