Lynda - Designing a Mobile Website with Muse

Build and publish a complete mobile website in Adobe Muse. In this course, Steve Harris shows you how to modify a traditional desktop site's layout and content so that it displays elegantly on mobile screen sizes and responds to gestures and orientation changes. First, you'll learn how to set up a new mobile site in Muse and copy over text and images. Then look at different mobile navigation strategies (tabbed panels, slideshows, and more) and decide which one is right for you—or create a totally unique system by combining existing navigation widgets. The course also shows you how to add additional content like buttons and video, and modify widgets from your desktop experience to better fit the mobile design. Plus, learn to preview, publish, and test the new mobile site.

Topics include:
Adding a mobile version to your existing site
Responding to gestures and orientation changes
Setting up a mobile site
Exploring mobile navigation systems
Creating master pages
Embedding video content
Adding a desktop link
Adding slideshows
Publishing your mobile site

Introduction
Welcome
Using the exercise files
Touring the Red30 mobile site
Using the Xcode iOS Simulator

1. Mobile Site Design Principles and Strategies
Content strategy for mobile
Usability and design considerations
Mobile gestures and interaction
Device orientation
Tablet design considerations

2. Setting Up Your Mobile Site
Setting up new site attributes
Adding a mobile version to your existing site
Moving content from your desktop site

3. Mobile Navigation Models
Exploring mobile navigation systems
Building the mobile navigation elements
Mobile navigation design: Accordion widget
Mobile navigation design: Lightbox widget
Mobile navigation design: Tabbed Panel widget
Mobile navigation design: Slideshow widget
Mobile navigation design: Scrolling anchors

4. Adding Site Content
Creating master pages
Adding text and text styles
Creating mobile buttons
Embedding content
Adding a desktop link

5. Adding Widgets to Your Site
Modifying the office photos slideshow widget for mobile
Creating the team page accordion widget
Modifying the lightbox portfolio gallery for mobile
Creating the mobile contact page

6. Mobile Testing and Tips
Publishing and testing your mobile site
Additional tools for previewing your website
Mobile sites and hosting servers

Conclusion
Next steps