آموزش Omnigraffle برای UX و طوفان مغزی

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

معرفی Introduction

• تجربه کاربر و طراحی تفکر با Omnigraffle User experience and design thinking with OmniGraffle

• یک یادداشت سریع قبل از شروع A quick note before starting

1. سازمان های تصویری: نمودارهای ORG 1. Diagramming Organizations: Org Charts

• نمودار با اشکال و خطوط Diagram with shapes and lines

• استفاده از متن به طور موثر Use text effectively

• شکل سبک Style shapes

• خطوط سبک Style lines

• سبک و متن متن Style and position text

• شکل دادن به شکل Align shapes

• توزیع اشکال Distribute shapes

• اشیاء گروهی Group objects

• یک افسانه ایجاد کنید Create a legend

2. محتوای نقشه برداری 2. Mapping Content

• سازماندهی محتوا با اشکال و متن Organizing content with shapes and text

• کنترل نقاط اتصال با آهن ربا Controlling connection points with magnets

• پیدا کردن و استفاده از استنسیل ها Finding and using stencils

• با استفاده از یک استنسیل برای ایجاد یک نقشه سایت Using a stencil to create a sitemap

• ویرایش اشیاء استنسیل به نمودار یک گروه Editing stencil objects to diagram a group

• Refination Sitemap Content Refining sitemap content

• اتصالات نقشه سایت پالایش با خطوط متعامد Refining sitemap connections with orthogonal lines

• نهایی کردن نقشه سایت Finalizing the sitemap

• ایجاد یک کارت گرافیک فهرست Creating an index card graphic

• سازماندهی محتوای خطی به عنوان کارت های شاخص مجازی Organizing linear content as virtual index cards

3. جریان جریان 3. Process Flows

• یک نمودار جریان فرایند را با Stencils ایجاد کنید Create a process flow diagram with stencils

• یک جریان فرآیند را بر اساس بازخورد ویرایش کنید Edit a process flow based on feedback

• ایجاد سناریوهای مورد استفاده چندگانه Create multiple use case scenarios

• نمودار تعامل آنلاین پیچیده Diagram a complex online interaction

• نمودار یک فرآیند که شامل جنبه های دنیای واقعی و آنلاین است Diagram a process that involves real-world and online aspects

4. Wireframes 4. Wireframes

• نگاهی به Wireframe نگاه و استنسیل را انتخاب کنید Choose a wireframe look and stencil

• Wireframe یک صفحه اصلی Wireframe a homepage

• ویرایش ناوبری مداوم Edit persistent navigation

• Wireframe یک صفحه جستجوی پیشرفته Wireframe an advanced search page

• Wireframe یک نتیجه جستجو یا مرور صفحه Wireframe a search result or browse page

• Wireframe یک صفحه محتوا برای انواع مختلف رسانه ها Wireframe a content page for different kinds of media

5. ایده و طوفان مغزی 5. Ideation and Brainstorming

• نقشه برداری ذهن با ابزار نمودار Mind mapping with the Diagram tool

• نقشه های ذهنی سبک با سبک های سند و طرح بندی Style mind maps with document styles and layouts

• طراحی ایده های طراحی بصری Sketching visual design ideas

• طراحی لوگوی خشن با استنسیل ها Designing a rough logo with stencils

6. نسخه حرفه ای برجسته 6. Pro Version Highlights

• ایجاد زیرگراف های قابل انعطاف Creating collapsible subgraphs

• زیرگروه های یک ظاهر طراحی شده Styling subgraphs

• تبدیل متن به شکل Convert text to shapes

• ویرایش جزئیات با چند پنجره Editing details with multiple windows

• لایه های مشترک Shared layers

• صادرات لایه های فتوشاپ Export Photoshop layers

نتیجه Conclusion

• مراحل بعدی Next steps