Web Design
Using Balsamiq
Introduction to Balsamiq Mockups
Working with Balsamiq Versions and Plugins

Introduction to Balsamiq Mockups

Course Number:
wd_usba_a01_it_enus
Lesson Objectives

Introduction to Balsamiq Mockups

  • start the course
  • describe what a wireframe is, the difference between low-fidelity and high-fidelity wireframes, the elements of wireframes, and how they can be used when creating web sites
  • describe the versions of Balsamiq and the benefits each provides when creating mockups for wireframing
  • describe the available Balsamiq plugins and the benefits they provide when creating mockups for wireframing
  • download and install the Balsamiq Mockups 3 for Desktop application and identify the major areas of the application’s interface
  • add and edit UI controls in Balsamiq Mockups 3 for Desktop
  • snap, align, clone, and arrange UI controls in a mockup
  • layer controls in your mockups and describe the benefits of using layering
  • group and crop controls and describe the benefits associated with each of these features
  • work with the Property Inspector to alter control properties and add notes for your mockups, symbols, and assets
  • create and work with alternate versions of a mockup and describe the benefits of using alternates
  • work with the Project Info Panel and skins, and identify the differences and benefits of the sketch and wireframe skins
  • work with text in the mockup controls, including formatting and adding links to text
  • work with icons, including the different methods available for locating, adding, and changing icons in your wireframes
  • work with custom icons, including how to create and add your own icons and how to import existing sets of icons
  • work with images, including how to add and manipulate their properties in your mockups
  • use the Asset view to manage icons, images, and other assets for your mockups
  • work with the data grid control, including how to import data from Excel spreadsheets
  • use markup components to include annotations, comments, and explanations in your mockups
  • create a site map using the site map control
  • create, import, and use symbols in your Balsamiq mockups
  • manage symbols in your mockups, including overriding properties and using symbols in multiple projects
  • work with the menu bar and menu controls
  • use controls in Balsamiq Mockups 3 for Desktop to create a mockup

Overview/Description
Developing a successful software application includes ensuring the user experience is a good one. Creating mockups of the application’s interface and basic interaction allows for rapid development and helps ensure that the required functionality is included in the end product. In this course, you will learn the fundamentals of the Balsamiq Mockups 3 for Desktop tool including the interface controls available and how to work with and manipulate individual and groups of controls. In addition, you will learn about the concepts of layering, cropping, and symbols, and how they can aid in developing mockups.

Target Audience
Individuals involved in the design and development of software applications; developers looking for a rapid tool for wireframing; individuals interested in learning the fundamentals of creating mockups and wireframes using the Balsamiq Mockups tools.

Introduction to Balsamiq Mockups

Course Number:
wd_usba_a01_it_enus
Lesson Objectives

Introduction to Balsamiq Mockups

  • start the course
  • describe what a wireframe is, the difference between low-fidelity and high-fidelity wireframes, the elements of wireframes, and how they can be used when creating web sites
  • describe the versions of Balsamiq and the benefits each provides when creating mockups for wireframing
  • describe the available Balsamiq plugins and the benefits they provide when creating mockups for wireframing
  • download and install the Balsamiq Mockups 3 for Desktop application and identify the major areas of the application’s interface
  • add and edit UI controls in Balsamiq Mockups 3 for Desktop
  • snap, align, clone, and arrange UI controls in a mockup
  • layer controls in your mockups and describe the benefits of using layering
  • group and crop controls and describe the benefits associated with each of these features
  • work with the Property Inspector to alter control properties and add notes for your mockups, symbols, and assets
  • create and work with alternate versions of a mockup and describe the benefits of using alternates
  • work with the Project Info Panel and skins, and identify the differences and benefits of the sketch and wireframe skins
  • work with text in the mockup controls, including formatting and adding links to text
  • work with icons, including the different methods available for locating, adding, and changing icons in your wireframes
  • work with custom icons, including how to create and add your own icons and how to import existing sets of icons
  • work with images, including how to add and manipulate their properties in your mockups
  • use the Asset view to manage icons, images, and other assets for your mockups
  • work with the data grid control, including how to import data from Excel spreadsheets
  • use markup components to include annotations, comments, and explanations in your mockups
  • create a site map using the site map control
  • create, import, and use symbols in your Balsamiq mockups
  • manage symbols in your mockups, including overriding properties and using symbols in multiple projects
  • work with the menu bar and menu controls
  • use controls in Balsamiq Mockups 3 for Desktop to create a mockup

Overview/Description
Developing a successful software application includes ensuring the user experience is a good one. Creating mockups of the application’s interface and basic interaction allows for rapid development and helps ensure that the required functionality is included in the end product. In this course, you will learn the fundamentals of the Balsamiq Mockups 3 for Desktop tool including the interface controls available and how to work with and manipulate individual and groups of controls. In addition, you will learn about the concepts of layering, cropping, and symbols, and how they can aid in developing mockups.

Target Audience
Individuals involved in the design and development of software applications; developers looking for a rapid tool for wireframing; individuals interested in learning the fundamentals of creating mockups and wireframes using the Balsamiq Mockups tools.

Working with Balsamiq Versions and Plugins

Course Number:
wd_usba_a02_it_enus
Lesson Objectives

Working with Balsamiq Versions and Plugins

  • start the course
  • create a header symbol for use in your mockups
  • create a footer symbol for use in your mockups
  • work with the modal screen control to create a modal view screen
  • create a custom linkable control in your mockups
  • create an image gallery and a thumbnail bar to show selected image
  • create the hover state to display full images
  • use linking in your mockups to create a clickable wireframe
  • import existing assets from other web sites for use in your mockups
  • import existing mockups and symbols into your current project
  • export your mockups to images, PDF files, and other projects
  • plan and begin creating a mockup for a Windows application
  • finish creating a mockup for a Windows application
  • plan and begin creating a mockup for a Mobile App
  • continue creating a mockup for a Mobile App
  • finish creating a mockup for a Mobile App
  • download, install, and configure user and site settings in myBalsamiq
  • plan and begin creating a mockup using myBalsamiq
  • continue creating a mockup using myBalsamiq
  • finish creating a mockup using myBalsamiq
  • install, configure, and begin creating a mockup using Mockups 3 for Google Drive
  • continue creating a mockup using Mockups 3 for Google Drive
  • finish creating a mockup using Mockups 3 for Google Drive
  • use Balsamiq mockups to create a wireframe

Overview/Description
Creating mockups and wireframes is a useful method for aiding in the design and development of software applications. In this course, you will learn how to work with Balsamiq Mockups 3 for Desktop, myBalsamiq, and Mockups 3 for Google Drive to create mockups for Windows, web, and mobile applications. Specifically, you will learn how to create a header and footer, a modal view, linkable control, image gallery, and complete wireframes using the various versions of the Balsamiq Mockups tools, as well as how to import and export assets and how to export mockups in various formats.

Target Audience
Individuals involved in the design and development of software applications; developers looking for a rapid tool for wireframing; individuals interested in learning the fundamentals of creating mockups and wireframes using the Balsamiq Mockups tools.

Working with Balsamiq Versions and Plugins

Course Number:
wd_usba_a02_it_enus
Lesson Objectives

Working with Balsamiq Versions and Plugins

  • start the course
  • create a header symbol for use in your mockups
  • create a footer symbol for use in your mockups
  • work with the modal screen control to create a modal view screen
  • create a custom linkable control in your mockups
  • create an image gallery and a thumbnail bar to show selected image
  • create the hover state to display full images
  • use linking in your mockups to create a clickable wireframe
  • import existing assets from other web sites for use in your mockups
  • import existing mockups and symbols into your current project
  • export your mockups to images, PDF files, and other projects
  • plan and begin creating a mockup for a Windows application
  • finish creating a mockup for a Windows application
  • plan and begin creating a mockup for a Mobile App
  • continue creating a mockup for a Mobile App
  • finish creating a mockup for a Mobile App
  • download, install, and configure user and site settings in myBalsamiq
  • plan and begin creating a mockup using myBalsamiq
  • continue creating a mockup using myBalsamiq
  • finish creating a mockup using myBalsamiq
  • install, configure, and begin creating a mockup using Mockups 3 for Google Drive
  • continue creating a mockup using Mockups 3 for Google Drive
  • finish creating a mockup using Mockups 3 for Google Drive
  • use Balsamiq mockups to create a wireframe

Overview/Description
Creating mockups and wireframes is a useful method for aiding in the design and development of software applications. In this course, you will learn how to work with Balsamiq Mockups 3 for Desktop, myBalsamiq, and Mockups 3 for Google Drive to create mockups for Windows, web, and mobile applications. Specifically, you will learn how to create a header and footer, a modal view, linkable control, image gallery, and complete wireframes using the various versions of the Balsamiq Mockups tools, as well as how to import and export assets and how to export mockups in various formats.

Target Audience
Individuals involved in the design and development of software applications; developers looking for a rapid tool for wireframing; individuals interested in learning the fundamentals of creating mockups and wireframes using the Balsamiq Mockups tools.

Close Chat Live