آموزش راهنمای دقیق ساخت وایرفریم با استفاده از موکاپ های Balsamiq

سرفصل ها و درس ها

معرفی Introduction

• معرفی Introduction

• چرا این دوره را بگذرانید Why Take this Course

• هدف دوره Course Objective

• تنظیم نام دامنه Domain Name Setup

• گرفتن ابزار Balsamique Mockup Getting Balsamique Mockup Tool

مقدمه ای بر رویکرد تفکر طراحی و اصطلاحات طراحی Introduction to Design Thinking approach & Design Terminologies

• چرا ابتدا طراحی را یاد بگیریم Why Learn Design First

• اصطلاحات طراحی پایه Basic Design Terminologies

• انواع وب سایت Types of Websites

مقدمه ای بر WireFraming با استفاده از مطالعه موردی واقعی Introduction to WireFraming using a Real Life Case Study

• Wireframes چیست؟ What Are Wireframes

• تجزیه و تحلیل یک مطالعه موردی Analysing A Case Study

ساختن شخصیت های کاربر - شیرجه عمیق Building User Personas - A Deep Dive

• شخصیت کاربر برای "PennyPot.Com" User Persona For "PennyPot.Com"

• پرسونای کاربر برای کارفرمایی که به دنبال مترجم آزاد است User Persona for an Employer Looking for a Freelancer

تجزیه و تحلیل وب سایت مرجع و Balsamiq Analysing the reference website & Balsamiq

• تجزیه و تحلیل وب سایت مرجع Analysing the Reference Website

• آشنایی با Balsamiq Getting Familiar with Balsamiq

ایجاد وایرفریم از صفحات مختلف Creating Wireframes of Various Screens

• صفحه نمایش 1 Screen 1

• صفحه نمایش 2 Screen 2

• آیکون های باقی مانده را روی صفحه اضافه کنید Add the Remaining Icons on the Screen

• صفحه نمایش 3 Screen 3

• صفحه 3 ادامه دارد Screen 3 Continued

• صفحه نمایش 4 Screen 4

• صفحه نمایش 5 Screen 5

• صفحه نمایش 6 Screen 6

• منوی همبرگر Hamburger Menu

ساخت وایرفریم تعاملی قسمت 1 Making the Wireframe Interactive Part 1

• درک نقاط لنگر Understanding Anchor Points

• افزودن تعامل بین صفحه نمایش قسمت 1 Adding Interactivity Between the Screen Part 1

• افزودن تعامل بین صفحه نمایش قسمت 2 Adding Interactivity Between the Screens Part 2

به اشتراک گذاری Wireframes با Final Touchers Sharing the Wireframes With Final Touchers

• تغییر پوست Changing the Skin

• صادرات PDF های تعاملی Exporting Interactive PDF's

خلاصه Recap

• خلاصه Recap

قاب بندی سیم صفحه فرود آماده برای موبایل Wire Framing a Mobile Ready Landing Page

• وایرفریم کردن صفحه فرود - 1 Wireframing the Landing Page - 1

• قاب بندی صفحه فرود - درس 2 Wireframing the Landing Page - Lesson 2