آموزش Adobe Muse

شروع موضوع توسط michealwiper ‏17 ژانویه 2014 در انجمن مسایل عمومی طراحی و توسعه‌وب

کلمات کلیدی:
  1. michealwiper

    michealwiper Active Member

    ارسال‌ها:
    557
    تشکر شده:
    204
    امتیاز دستاورد:
    43
    سلام دوستان خوب
    میخاستم درمورد نرم افزار جدید Adobe که برای طراحی سایت بدون نوشتن حتی یه خط کد نویسی تولید شده و در اختیار عموم قرار گرفته هرکسی توضیحی و آموزشی چیزی داره اینجا بزاره

    برای شروع بصورت کاملت مبتدی خودم اینکارو میکنم امیدوارم در آینده از تجربه بیشتر دوستان هم استفاده بشه :rose:



    شرکت Adobe برای کسانی که سلیقه بهتری در طراحی دارند (و علاقه ای به برنامه نویسی ندارند)، کار را آسان تر کرده است. این دسته از افزار می توانند از نرم افزار Muse محصول شرکت Adobe استفاده نمایند. ادوبی ادعا می کند که این نرم افزار که دارای قابلت AIR بوده و همچنین می توان از آن در دو پلتفرم مک و ویندوز استفاده کرد، می تواند به هر کاربری کمک کند تا بدون نیاز به نوشتن یک خط کد، به طراحی و انتشار وب سایت های html بپردازد.
    ایجاد طرح

    یک سوال قبل از شروع کار : چرا ما باید از ابزارهایی مانند Muse برای تولید وب سایت استفاده کنیم در حالیکه به جای آن می توان از WordPress و تم های آن استفاده کرد؟ جواب در یک کلمه خلاصه می شود : « سفارشی سازی ». با اینکه هزاران تم برای وردپرس موجود است، سفارشی سازی یک تم یا قالب متناسب با نیاز ما کار دشواری است. دلیل دیگر این است که استفاده از یک سیستم دیتابیس برای وردپرس به منظور ایجاد یک سایت ساده و خطی، بسیار زیاده روی است..
    شما می توانید Muse را از وب سایت ادوبی دانلود کنید. این نرم افزار تا وقتی که v1.0 در نزدیکی سال ۲۰۱۲ عرضه شود، به شکل رایگان در دسترس است. از این نرم افزار می توانید بر روی سیستم عامل ویندوز و یا مکینتاش استفاده کنید؛ ولی قبل از باید AIR رو سیستم شما نصب باشد.
    برای درک بهتر نحوه کار Muse، بهتر است با هم ساخت یک صفحه ساده شخصی را امتحان کنیم، چیزی شبیه Flavors.com یاAbout.me. کار را با انتخاب گزینه Create New Site از پنجره شروع نرم افزار یا منوی File، آغاز می کنیم.


    [​IMG]


    پس از آن از شما سوال خواهد شد تا سایت خود را با تنظیم کردن عرض صفحه، تعداد ستون ها، حاشیه ها و … سفارشی سازی کنید.


    [​IMG]

    اولین مرحله در طراحی یک وب سایت، مشخص کردن تعداد صفحاتی است که می خواهید سایتتان داشته باشد و پس از آن باید ارتباط بین آنها را مشخص کنید. شما به سادگی می توانید صفحات خود را در پنجره Plan اضافه، حذف یا مرتب کنید.


    [​IMG]


    برای اضافه کردن صفحه بر روی گزینه “+” کلیک کنید و برای بستن آن هم می توانید روی گزینه “X” کلیک کنید. برای تغییر نام صفحه بر روی نام آن کلیک کنید، سپس می توانید با درگ و دراپ کردن، آن ها را مرتب کرده و جایشان را عوض کنید.


    [​IMG]


    در پایین صفحه می توانید صفحه A-Master را ببینید. این قالبی خواهد بود که در سراسر سایت شما استفاده می شود. پس اگر المنت هایی (اجزاء) وجود دارند که می خواهید آن ها را در همه صفحاتتان نگه دارید، پس بهتر است به جای کپی کردن و تکرار آن در همه صفحات،

    آن را در صفحه A-Master تعبیه کنید.


    [​IMG]



    ساختن سایت

    اگر بر روی هر یک از صفحات دابل کلیک کنید، آن صفحه در یک تب (زبانه) جدید برای شما باز خواهد شد. با استفاده از ابزارهای درون جعبه ابزار در قسمت بالای نرم افزار، قادر به ساختن، ویرایش، طراحی و ایجاد بخش های دلخواهتان در صفحه خواهید بود.


    [​IMG]


    ابزارهای دیگری که می توانند به شما در پروسه طراحی کمک کنند، “Panels” (پنل ها) در سمت راست هستند. شما می توانید این پنل ها را با استفاده از منوی Window، مخفی کرده و یا نمایش دهید.


    [​IMG]

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


    [​IMG]


    در ادامه، یک منوی به اصطلاح Navigation (ناوبری) را با انتخاب آن از پنل Widget به سایت اضافه می کنیم، سپس می توانیم آن را به درون صفحه درگ یا دراپ کنیم.


    [​IMG]


    شما می توانید منوی Navigation خودتان را با استفاده از بخش Options تغییر دهید و سفارشی سازی کنید. بر روی فلش کوچک آبی کلیک کنید تا پنجره Options ظاهر شود.



    [​IMG]


    همچنین شما می توانید ظاهر متون را مانند شکل نمایش، رنگ و اندازه را با استفاده تب Text در پنل های سمت راست تغییر دهید.



    [​IMG]


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

    انجام دهید. برای اضافه کردن لینک های خروجی (یا دیگر المنت های html)، از گزینه Insert HTML موجود در منوی Object استفاده کنید.


    [​IMG]



    سپس کد html لینک های مورد نظرتان را در پنجره باز شده بنویسید و بر روی OK کلیک کنید تا به سایت شما اضافه شوند.


    [​IMG]


    همانند دیگر المنت ها، کد html اضافه شده نیز قابل سفارشی سازی و تغییر است. متاسفانه هنوز امکان تغییر رنگ لینک برای ما وجود ندارد. اما خوشبختانه این امکان در نسخه جدید نرم افزار قرار خواهد گرفت.


    [​IMG]


    بعد از این که همه چیز را درست و مطابق نیازتان تنظیم کردید، می توانید نتیجه را با کلیک بر روی لینک Preview مشاهده کنید.


    [​IMG]


    آخرین مرحله

    بعد از انجام همه کارها، شما اماده اید تا سایت خود را در وب قرار دهید. برای انجام اینکار، از گزینه export as HTML موجود در منوی File استفاده کنید.


    [​IMG]


    محل دلخواهتان برای ذخیره پروژه را انتخاب کرده و سپس بر روی گزینه Export کلیک کنید.


    [​IMG]


    اگر دارای یک URL یا آدرس می باشید و میخواهید صفحه شخصی ساخته شده خودتان را به آن متصل کنید، می توانید از سرویس های کلاینت FTP برای آپلود تمامی فایل هایتان در اکانت هاست تان، استفاده کنید. از آنجا که ارائه دهندگان هاستینگ از تنظیمات متفاوتی

    استفاده می کنند، لطفا با سرویس میزبانی خود در این بار مشورت کنید.


    [​IMG]

    این آزمایش کوتاه، چگونی ایجاد وب سایت با استفاده از Muse را به سادگی اضافه کردن و سفارشی سازی المنت ها، به ما نشان داد. البته باید بدانید که Muse قادر به تولید سایت های پیچیده تر با صفحات زیادتر هم میباشد. مثال های زیادی از وب سایت هایی وجود دارد که

    نشان میدهد Muse چگونه می تواند صفحه ورودی و یا ویترین آن ها را طراحی کند.

     
    آخرین ویرایش: ‏17 ژانویه 2014
    نوشته شده توسط michealwiper در ‏17 ژانویه 2014
    sorooshpardaz، amir-cg، LinkinForEver و 4 نفر دیگر از این ارسال تشکر کرده اند.
  2. mohammad_r03

    mohammad_r03 New Member

    ارسال‌ها:
    10
    تشکر شده:
    2
    امتیاز دستاورد:
    1
    سلام
    من قبلا از نرم افزار ارتیستیک استفاده می کردم اینم یه نرم افزار خوبی بود ممنون.
     
    نوشته شده توسط mohammad_r03 در ‏22 ژوئن 2014
    michealwiper از این پست تشکر کرده است.
  3. michealwiper

    michealwiper Active Member

    ارسال‌ها:
    557
    تشکر شده:
    204
    امتیاز دستاورد:
    43
    خب فکر میکنی که از لحاظ امکانات کودوم بهتر باشه و همچنین راحتی کار؟
     
    نوشته شده توسط michealwiper در ‏20 ژانویه 2015
  4. rahim222

    rahim222 New Member

    ارسال‌ها:
    3
    تشکر شده:
    0
    امتیاز دستاورد:
    1
    خسته نباشید واقعا برنامه muse یه کمک برای کسایی هست که میخواهند سایت خودشون رو با دست خودشون بسازند
     
    آخرین ویرایش: ‏24 نوامبر 2015
    نوشته شده توسط rahim222 در ‏10 می 2015

به اشتراک بگذارید