Design

Create website with Adobe Muse

Hello everybody! I am Thuzar San who is working as a Web Designer in Spiceworks Myanmar Co.Ltd.

Today, I would like to share about Adobe Muse.

Adobe Muse

Adobe muse is a website builder to create responsive website without having to write any code. Muse Generates static websites giving users the freedom to host their sites with any code provider. User can add more functionality such as blogging and ecommerce to their website with plugins, available through Adobe’s Creative Cloud subscription. Generate Static HTML. muse file, the file can be exported to the browser for testing.

Adobe Muse History

  • First version released in 2012 .2012 > Built in contact forms, auto generated sitemaps, navigation, faster loading time, ability to attach files, Enhanced code quality, HTML5 animations, and mobile layout options.2013 > Browser editing, scroll effects, ability for developers to create 3rd party widgets, social media widgets, and full-screen slideshows.
  • 2014 > web fonts, bullet and number lists, reCaptcha integration, SVG import, text synchronizing across desktop and mobile, Secure FTP support .2015 – 2017 > Usability and performance improvements, Contact forms updates, free form responsive web design, Better collaboration with libraries, support for animations through CC Libraries, Support for Google reCAPTCHA version2.

Plan Section and Master Page

  • Muse website is structures through the plan section. You can drag and drop pages to order and create hierarchy. Design pages by dragging and dropping elements. There is no structure to pages, you can drop elements anywhere on the page.
  • Master Page page will hold parts of the design that you’ll use one every page of the website. This is very clever solution to a common problem. Which allows you to easily create one (or many) master pages and then apply them to your site pages. Then, if you need to edit something global (a navigation link in the header), you can update the master once, and it will automatically apply to the pages based on that master. No need to perform the same edits to each page of your site.

Breakpoints for Responsive

Set a text box to ‘Responsive Width’ and Muse will change its width proportionally with that of the browser’s width. For example, breakpoints. So rather than setting a text box to be responsive, instead keep its width locked and modify it as needed in each of the various breakpoint zones you create.

Responsive text and images

One might think that you should be able to click on all the ‘responsive’ settings for everything. Well Muse does give us that option, we just have to learn to use it properly. Resize menus can be found both at the top of the screen, and by right-clicking on a page object. This option is available for both images and text boxes, though they are obviously treated differently.

Sample website with Muse

Saving and Preview website

  • Save: File > Save Site .
  • Preview: Preview or File > Preview site in browser.
  • Publish: Publish to Business Catalyst, FTP Host, Export as HTML.
Hello

Leave a Reply

Your email address will not be published. Required fields are marked *