Adobe CC as Wireframe and Web Design Tool
|
|
- Leon Floyd
- 6 years ago
- Views:
Transcription
1 Start designing by doing very rough sketches on paper, or lately more often, if not near my office desk, on my ipad or smartphone screen. These sketches focus thoughts regarding the chosen concept and the client will probably never see any of them. Use Adobe Illustrator and InDesign combined. Illustrator for creating most of the UI kit elements and InDesign for wireframing itself. Source: 49 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
2 Master pages Quickly and consistently apply global design elements like navigation, headers, footers and so on. Create as many master pages as you need, and on top of it, one master can be based on another. Solid grid support Easily and apply different kinds of grids, complementing columns, horizontal and vertical guides to create modules, and subgrids for greater complexity and precision. Alternate layouts Enable wireframes for multiple devices and orientations in the same file. CC Libraries Access and reuse different assets like commonly used objects, colours, character and paragraph styles. Create assets in InDesign, Illustrator, Photoshop or with the Adobe Capture mobile app, Layers Ability to organize, group, show/hide and lock/unlock objects and content selectively in the wireframe. Every page of a multi-page In- Design document has the same number and order of layers. All of the changes you make to layers are reflected on all pages, like visibility, stacking order or deletion. Styles and tables Give complete control over the look of your text, objects and tables through the use of InDesign styles. Styles can be based on each other providing the ability to cascade desired formatting easily throughout the document. Creation and formatting of tables. 50 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
3 Export options Export a variety of formats. Interactive PDF Publish Online converts document to interactive HTML that can be viewed in desktop and mobile browsers. Exported file is hosted on Adobe servers. Share the URL or embed it into a site. Create and prepare templates and object assets by yourself. Most of this work will be done only once and after a few hours of work you ll be ready There are a lot of assets and wireframe kits that on the internet InDesign documents can t export directly as layered PSD files If visual design is in Adobe Photoshop and want to have separated wireframe elements, Export PSD wireframes to PDF first, then open that PDF in Illustrator and export as layered PSD. Free to script to save InDesign files as a layered PSD New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
4
5
6
7
8
9
10 Create saved Workspace in Illustrator and InDesign Save the workspace by choosing Window > Workspace > New Workspace Do the same thing in InDesign using Digital Publishing workspace as a starter. Assembling Wireframe/Mockup/Prototype Kits Invest some time in making your user interface assets kit first. Adobe Creative Cloud, CC Libraries store all your components. Create one Library for websites wireframing, other for ios application, third for Android applications and so on. Create library Open Libraries panel and choose Create New Library from additional drop-down menu. Assets put in libraries can be made and used in different Adobe desktop or mobile apps on all devices you log into with your Adobe ID. Libraries can contain colours, graphics, layer styles (Photoshop only), paragraph and character styles. You add asset in library by clicking on the corresponding button at the bot- 58 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
11 tom of CC Library panel with respective element selected. You can also add graphic assets by dragging them directly from your artboard to Libraries panel. Assets in libraries are organized by categories. Libraries are searchable, Creating Components Illustrator is a much better choice for drawing different kinds of elements As a rule of thumb, make all kit elements that request some drawing beyond basic geometric shapes in Illustrator and simpler elements, that contain text you ll need to change in layout, like simple buttons, in InDesign. Make a list of all the elements in the wireframe you ll need, like navigation elements, page elements including images, video frames and text boxes, icons, avatars, form elements and all other interface elements. 59 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
12 Start by creating a new document for wireframe or mockup kit components. Choose either Web/Devices Profile in Illustrator or Web/Digital Publishing Intent from New Document dialog box, so pixels are used as units, and color mode is RGB. Make wireframe kit assets as simple as possible. You should use very limited colour palettes of preferably a few shades of grey. Visually accentuate elements that are more important by coloring them with darker shades, or by giving them bigger contrast. Adobe Illustrator assets in CC Libraries Assets you add to Libraries from Illustrator are linked by default. That means that when you modify a library asset in Illustrator, changes are reflected in all instances used. If you want to add unlinked asset to document press Option/Alt key while dragging it from the panel. When you use linked Illustrator assets in InDesign they have little cloud icon in the upper left corner when document is viewed in Normal mode 60 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
13 and they are all listed in Links panel. If you modify Library asset in Illustrator changes in the InDesign document won t be done automatically. Cloud icon will be replaced with Modified Link exclamation mark icon, and you ll have to update these links. InDesign assets you place in InDesign document are not linked. That means that you can edit instances independently of the original, and when the original asset is modified those changes are not reflected on assets you already put into layout. InDesign Flexibility with Texts InDesign has a nice feature for filling text boxes with placeholder text. When you draw text box just make a right mouse click on it and choose Fill With Placeholder Text. You can easily add text box to Library like any other graphic element just by dragging. Make button UI elements in InDesign too. To create a button, make text frame first, type respective text in it and then use Object > Text Frame 61 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
14 Options to define Inset spacing. Adjust Vertical Justification of text inside a box by choosing desired option from Align drop-down menu. Creating InDesign Wireframe Templates Create InDesign templates for making wireframes. Start by creating a new document with Web or Digital Publishing Intent and define appropriate page size for the screens you are designing for. Since it is recommended that you use some kind of a grid for laying out your wireframe elements set up the margins and create column grid by setting number of columns and the gutter space. You can change those settings later from Layout > Margins and Columns with respective master page (or pages) selected in Pages panel. If you need horizontal guides and complementary vertical guides, create them manually or make additional grid by using Layout > Create Guides When creating grid you can help yourself with one of the online grid calculator tools like the Gridulator. You can also create additional templates for presentation purposes with 62 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
15 device mockup as a frame for your wireframes. Since one InDesign document can be placed into another, you can create wireframes in one InDesign document and then place it into another one for presentation purposes. Keeping actual wireframe in separate document makes it easier to continue building from approved wireframes to polished visual design. When you make modifications on wireframe file just update it like any other link in presentation document, and ta-daaa! all changes are in your presentation too. In the Layers panel you can prepare separate layers for different kind of the content: user interface elements, interactive features, gestures, labels or notes. If you ll need more layers for a specific project you ll be able to easily add them anytime during the wireframing process. When you are done with creating save your templates as InDesign.indt template files. After all the templates you need are saved you are finally ready to start with wireframing efficiently. 63 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
16 Building Wireframes First things first start with the Master page. Drag all elements that will be the same on all screens of your project from Library. If you are designing website those are usually headers with logo and navigation and footer. Since you can make more than one Master page and they can be based on each other don t forget to take advantage of that feature. For example, depending on the project, you can create a Master page for one website category, then make new Masters based on the first one and change on them only elements that need to be different for other categories you re also having. You can t select, change or delete Master elements on regular document pages unless you click on them while holding Command/Control + Shift to override the master. Once your element is overridden you can change any of its parameters or completely delete it from layout. Keep in mind that even when you override the element, it s parameters that you haven t change are still dependent on the Master. For example, if you override an 64 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
17 element and change it s color, it s size is still connected to Master s and if you change it on Master page it will also be modified on that element you previously overrided. When inserting additional pages to your wireframing document remember to base them on the respective master. If you need to change the Master for pages already in layout, select them in Pages panel, make a right click and choose Apply Master to Pages When you are finished with Masters, move along with pages for all screens of your project. Use Library assets and arrange them using Smart Guides and Align options to create final UI wireframe layout. IIf you are making design for more than one screen size, make alternate layouts from Layouts > Create Alternate Layout or Pages panel. You can use liquid layout rules when creating alternate layouts to automatically or semi-automatically adopt page elements from one size and orientation to another or you can manually control them. For applying and testing Liquid Layout Rules use Page Tool or open panel: Window > Interactive > Liquid Layout. 65 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
18 If you want to convert your document to HTML prototype using InDesign CC 2015 Publish Online feature you can use much more interactive options like animations, multistate objects, multiple button actions, including all those intended for SWF/EPUB export. You can add simple animations using Animation panel and choosing one of the built-in Presets from drop-down menu and setting its properties. One object can have only one animation applied, but if you need to add more of them, group your object with empty box and use the new animation on that newly created object. And repeat that few times if needed. For objects you need to show different states create multi state object. Create object for each state. Object can be a single element (picture, text box, graphic) or a group of different elements. Open Window > Interactive > Object States panel, select all objects you created for multi state object and click on the New button at the panel bottom. After your multi state object is made you ll need to create buttons to go from one object state to another. Go To Next State or Go To Previous State actions reveal the specific object state with Go to State action. 66 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
19 If you want to have scrollable frame in your wireframe/prototype easiest way to create one is by using Universal Scrolling Frames extension from Ajar Productions. After you download and install extension you can use it as InDesign panel. For scrollable frame you ll need to make content and one frame for container. Content can be text frame, picture, or more elements combined. If using more than one element as a content don t forget to group them. When you are finished with making content and container box select the content and do Edit > Cut. Then select container and paste content inside by using Edit > Paste Into. Select container and using Universal Scrolling Frames adjust desired scroll direction. By combining buttons, multistate objects, animations and scrollable frames you can achieve rich interactive experience. To test interactivity in InDesign use EPUB Interactivity Preview panel. You can preview single page or whole document. Enlarge preview panel to your convenience. 67 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
20 If you haven t being using Adobe InDesign interactive features yet be prepared that they have some learning curve, but with a little practice and few trial and error attempts you ll quickly master them. Exporting finished documents When you are done with the wireframe and presentation file making all that is left is show your great ideas to the client in best way possible. For that purpose you ll need to export your wireframes in one of the formats your client can preview. Although InDesign files can be exported in variety of formats you are probably going to use the most common Interactive PDF, or Publish Online feature if testing functional low or high fidelity prototypes. To save as interactive PDF choose Adobe PDF (Interactive) from Format drop-down menu in Export dialog box and adjust properties as needed. Do not forget to tick Forms and Media if there are interactive elements that you want to include. Clients can view PDF wireframes in free Adobe Reader and write all their comments in that same file. 68 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
21 You can also use PDF document you export from InDesign to create InVision (or some other tool that supports PDFs) prototype. If your standard prototyping tool, perhaps Marvel, can t import PDF export your InDesign wireframe pages as JPEG or PNG images. To export interactive HTML prototype that can be seen in modern browsers on different devices go to File > Publish Online or click on the Publish Online button from Application Bar. After the document is prepared to be published online and then uploaded you can copy document URL to share with all the stakeholders and start with reviewing process. You can also embed that published prototype on your site. Downside of Publish Online feature is that it doesn t have any additional control over the export and files are always stored at Adobe s servers. Also it s still preview feature and you can t be sure in which direction Adobe is going to develop it or even discontinue. Once your wireframe/prototype is exported it s time for testing, reviewing and iterating process to start 69 New York City College of Technology The City University of New York Department of Communication Design COMD 2427 Typographic Design III John De Santis
Adobe Fireworks CS Essential Techniques
Adobe Fireworks CS4 HOW-TOs 100 Essential Techniques Jim Babbage 170 Adding Structure to # 79 Your Documents Creating a Master Page You can only have one Master Page per file, and you can easily set any
More informationThe diverse software in the Adobe Creative Suite enables you to create
556010 Bk01Ch01.qxd 2/6/04 7:28 PM Page 9 Chapter 1: Introducing the Adobe Creative Suite In This Chapter Looking over InDesign Drawing with Illustrator Introducing Photoshop Getting started with Acrobat
More informationThe diverse software in Adobe Creative Suite 2 enables you to create
Chapter 1: Introducing Adobe Creative Suite 2 In This Chapter Looking over InDesign Drawing with Illustrator Introducing Photoshop Getting started with Acrobat Going over GoLive Integrating the programs
More informationTypography in Motion Project 3: Final Due Nov 2
NEW YORK CITY COLLEGE OF TECHNOLOGY DEPARTMENT OF COMMUNICATION DESIGN COMD 2427 Typographic Design III Sec. D210 Fall 17 Thur: 8:30 AM-11:00 AM Room: N-1118 Instructor: John Battista De Santis jdesantis@citytech.cuny.edu
More informationHow to Use Serif WebPlus 10
How to Use Serif WebPlus 10 Getting started 1. Open Serif WebPlus and select Start New Site from the Startup Screen 2. WebPlus will start a blank website for you. Take a few moments to familiarise yourself
More informationHow to create a prototype
Adobe Fireworks Guide How to create a prototype In this guide, you learn how to use Fireworks to combine a design comp and a wireframe to create an interactive prototype for a widget. A prototype is a
More informationbuild a digital portfolio in WebPlus X4
How to build a digital portfolio in WebPlus X4 Get started Open Serif WebPlus and select Start New Site from the Startup Wizard. WebPlus will open a blank website for you. Take a few moments to familiarise
More informationHow to Prepare Your Cards for Press Using InDesign
How to Prepare Your Cards for Press Using InDesign This Tutorial is Divided into Sections: 1. What do I Need? What is InDesign? 2. How to start a new document with InDesign (the template explained) 3.
More informationAdobe InDesign CS4. Introduction to Layout with InDesign
Introduction to Layout with InDesign InDesign is a powerful Desktop Publishing (layout) application. It is flexible enough so that it can be used by both new and experienced users because there is no single,
More informationORGANIZING YOUR ARTWORK WITH LAYERS
9 ORGANIZING YOUR ARTWORK WITH LAYERS Lesson overview In this lesson, you ll learn how to do the following: Work with the Layers panel. Create, rearrange, and lock layers and sublayers. Move objects between
More informationSOLO NETWORK. Adobe Flash Catalyst CS5.5. Create expressive interfaces and interactive content without writing code
(11) 4062-6971 (21) 4062-6971 (31) 4062-6971 (41) 4062-6971 (48) 4062-6971 (51) 4062-6971 (61) 4062-6971 Adobe Flash Catalyst CS5.5 Create expressive interfaces and interactive content without writing
More informationAdobe Creative Cloud InDesign CC
Adobe Creative Cloud InDesign CC 2015.2 November 2015 Release Feature Guide 11/16/15 40 minutes Artwork by Þorleifur Gunnar Gíslason behance.net/thollig Adobe InDesign CC 2015.2 (November 2015 Release)
More informationEXPORTING ASSETS. Lesson overview
15 EXPORTING ASSETS Lesson overview In this lesson, you ll learn how to do the following: Create pixel-perfect drawings. Use the Export For Screens command. Work with the Asset Export panel. Generate,
More informationCreating an Animated Navigation Bar in InDesign*
Creating an Animated Navigation Bar in InDesign* *for SWF or FLA export only Here s a digital dilemma: You want to provide navigation controls for readers, but you don t want to take up screen real estate
More informationHow to export and save files
How to export and save files Illustrator is popular with designers because they can create graphics that can be used in a wide variety of applications. You can easily save your work for print, video, or
More informationWelcome to Desktop Publishing with InDesign!
Welcome to Desktop Publishing with InDesign! What We ll Cover Today What is InDesign? Preparing a print project Creating a new document InDesign interface Working with layers and links Formatting and managing
More informationCopyrighted material - provided by Taylor & Francis Not for distribution
B efore we jump in and start building our websites we ll need to familiarize ourselves with Muse and its features. Much of the interface and toolset will be recognizable to you if you ve used any of Adobe
More informationUsing Dreamweaver CC. Logo. 4 Creating a Template. Page Heading. Page content in this area. About Us Gallery Ordering Contact Us Links
Using Dreamweaver CC 4 Creating a Template Now that the main page of our website is complete, we need to create the rest of the pages. Each of them will have a layout that follows the plan shown below.
More informationMicrosoft Word
OBJECTS: Shapes (part 1) Shapes and the Drawing Tools Basic shapes can be used to graphically represent information or categories. The NOTE: Please read the Objects (add-on) document before continuing.
More informationA QUICK TOUR OF ADOBE ILLUSTRATOR CC (2018 RELEASE)
A QUICK TOUR OF ADOBE ILLUSTRATOR CC (2018 RELEASE) Lesson overview In this interactive demonstration of Adobe Illustrator CC (2018 release), you ll get an overview of the main features of the application.
More informationHow to lay out a web page with CSS
Activity 2.6 guide How to lay out a web page with CSS You can use table design features in Adobe Dreamweaver CS4 to create a simple page layout. However, a more powerful technique is to use Cascading Style
More informationCreate ruler guides. Create a ruler guide
Create ruler guides Ruler guides are different from grids in that they can be positioned freely on a page or on a pasteboard. You can create two kinds of ruler guides: page guides, which appear only on
More informationCreating Buttons and Pop-up Menus
Using Fireworks CHAPTER 12 Creating Buttons and Pop-up Menus 12 In Macromedia Fireworks 8 you can create a variety of JavaScript buttons and CSS or JavaScript pop-up menus, even if you know nothing about
More informationBusinessObjects Frequently Asked Questions
BusinessObjects Frequently Asked Questions Contents Is there a quick way of printing together several reports from the same document?... 2 Is there a way of controlling the text wrap of a cell?... 2 How
More informationSETTINGS AND WORKSPACE
ADOBE ILLUSTRATOR Adobe Illustrator is a program used to create vector illustrations / graphics (.ai/.eps/.svg). These graphics will then be used for logos, banners, infographics, flyers... in print and
More informationENVIRONMENTALLY RESPONSIBLE PRINTING ARTWORK GUIDE BOOK ALL YOU NEED TO KNOW ABOUT CREATING ARTWORK FOR PRINT TOGETHER.
ENVIRONMENTALLY RESPONSIBLE PRINTING ARTWORK GUIDE BOOK ALL YOU NEED TO KNOW ABOUT CREATING ARTWORK FOR PRINT TOGETHER. contents pg3. Choose a Design application pg4. Artwork requirements pg5. Creating
More information13 PREPARING FILES FOR THE WEB
13 PREPARING FILES FOR THE WEB Lesson overview In this lesson, you ll learn how to do the following: Create and stylize a button for a website. Use layer groups and artboards. Optimize design assets for
More informationCOPYRIGHTED MATERIAL. Using Adobe Bridge. Lesson 1
Lesson Using Adobe Bridge What you ll learn in this lesson: Navigating Adobe Bridge Using folders in Bridge Making a Favorite Creating metadata Using automated tools Adobe Bridge is the command center
More informationMyGraphicsLab ADOBE INDESIGN CC COURSE FOR PRINT & DIGITAL MEDIA PUBLICATION Curriculum Mapping to ACA Objectives
ADOBE INDESIGN CC COURSE FOR PRINT & DIGITAL MEDIA PUBLICATION Curriculum Mapping to ACA Domain Domain 1.0 Setting Project Requirements 1.1 Identify the purpose, audience, and audience needs for preparing
More informationProject 3: Assignment 7 Due Oct 19 Typography in Motion
NEW YORK CITY COLLEGE OF TECHNOLOGY DEPARTMENT OF COMMUNICATION DESIGN COMD 2427 Typographic Design III Sec. D210 Fall 17 Thur: 8:30 AM-11:00 AM Room: N-1118 Instructor: John Battista De Santis jdesantis@citytech.cuny.edu
More informationOn the Web sun.com/aboutsun/comm_invest STAROFFICE 8 DRAW
STAROFFICE 8 DRAW Graphics They say a picture is worth a thousand words. Pictures are often used along with our words for good reason. They help communicate our thoughts. They give extra information that
More informationDecember 3, What is New in CC 2019
December 3, 2018 What is New in CC 2019 Photoshop NEW Frame Tool Quickly place or replace images using the new Frame tool. Images are automatically scaled to best fit the frame and swapping out content
More informationUsing Dreamweaver. 4 Creating a Template. Logo. Page Heading. Home About Us Gallery Ordering Contact Us Links. Page content in this area
4 Creating a Template Now that the main page of our website is complete, we need to create the rest of the pages. Each of them will have a layout that follows the plan that is shown below. Logo Page Heading
More informationBalsamiq manual. Balsamiq Main window. Image 1
1 Balsamiq manual Overview Balsamiq Mockups is a program that is produced by Balsamiq Studios (founded 2008). It is a relatively new program that allow users to create wireframes that feels like hand drawing
More informationIN DESIGN. A review of the overview
IN DESIGN A review of the overview InDesign Review GETTING STARTED: Start by clicking the InDesign icon in your dock. Wait for InDesign to load. Click on Create New Document If resuming work, find your
More informationQuick Guide for Photoshop CC Basics April 2016 Training:
Photoshop CC Basics Creating a New File 1. Click File > New 2. Keep Default Photoshop Size selected in the Preset drop-down list. 3. Click OK. Showing Rulers 1. On the Menu bar, click View. 2. Click Rulers.
More informationProject 3: Assignment 8 Due Oct 26 Typography in Motion
NEW YORK CITY COLLEGE OF TECHNOLOGY DEPARTMENT OF COMMUNICATION DESIGN COMD 2427 Typographic Design III Sec. D210 Fall 17 Thur: 8:30 AM-11:00 AM Room: N-1118 Instructor: John Battista De Santis jdesantis@citytech.cuny.edu
More informationWhat s New in QuarkXPress 2018
What s New in QuarkXPress 2018 Contents What s New in QuarkXPress 2018...1 Digital publishing...2 Export as Android App...2 HTML5 enhancements...3 Configuration changes...5 Graphics...7 Transparency blend
More informationWeek 5 Creating a Calendar. About Tables. Making a Calendar From a Table Template. Week 5 Word 2010
Week 5 Creating a Calendar About Tables Tables are a good way to organize information. They can consist of only a few cells, or many cells that cover several pages. You can arrange boxes or cells vertically
More informationAdobe InDesign Notes. Adobe InDesign CS3
Adobe InDesign Notes Adobe InDesign CS3 Page 2 Introduction These notes have been put together for basic and advanced methods, features and language. I have also created notes on other Adobe products.
More informationWix Website. Project overview. Step 1: Log onto a web browser and go to Step 2: Click Start Now. Step 3: Click Sign up
Project overview For this project you will be using the website building site www.wix.com to create a portfolio website to feature your past graphic design projects. Step 1: Log onto a web browser and
More informationDesign a basic 3 column brochure and newsletter: This handout covers Document Set-up, working with Graphics and Text.
an introduction InDesign 4.0 Workshop Objective Design a basic 3 column brochure and newsletter: This handout covers Document Set-up, working with Graphics and Text. Document Setup - 3 column brochure
More informationInDesign UX Design Patterns. by Justin Putney
InDesign UX Design Patterns by Justin Putney InDesign UX Design Patterns Hi, I m Justin Putney, Owner of Ajar Productions. Thanks for downloading this guide! It s full of ways to create interactive user
More information1. New document, set to 5in x 5in, no bleed. Color Mode should be default at CMYK. If it s not, changed that when the new document opens.
art 2413 typography fall 17 software review This exercise will reacquaint students with Adobe Illustrator, Photoshop, and InDesign. These are the three main design programs used by the industry. There
More informationIn Depth: Writer. The word processor is arguably the most popular element within any office suite. That. Formatting Text CHAPTER 23
CHAPTER 23 In Depth: Writer The word processor is arguably the most popular element within any office suite. That said, you ll be happy to know that OpenOffice.org s Writer component doesn t skimp on features.
More informationHow to create text and graphics with the
Adobe Premiere Pro CC Guide How to create text and graphics with the Essential Graphics Panel The Type tool in Premiere Pro is based on familiar ways of working with text and graphics found in other Adobe
More informationHow to lay out a web page with CSS
How to lay out a web page with CSS You can use table design features in Adobe Dreamweaver CS3 to create a simple page layout. However, a more powerful technique is to use Cascading Style Sheets (CSS).
More informationproj 3B intro to multi-page layout & interactive pdf
art 2413 typography fall 17 proj 3B intro to multi-page layout & interactive pdf objectives Students introduced to pre-made layered mockups that utilized smart art by placing vector artwork into the Photoshop
More informationGoldfish 4. Quick Start Tutorial
Goldfish 4 Quick Start Tutorial A Big Thank You to Tobias Schilpp 2018 Fishbeam Software Text, Graphics: Yves Pellot Proofread, Photos: Tobias Schilpp Publish Code: #180926 www.fishbeam.com Get to know
More informationHow to Prepare a Digital Edition PDF Book With Adobe InDesign
How to Prepare a Digital Edition PDF Book With Adobe InDesign This tutorial will offer you some advice on how to use Adobe InDesign to prepare an optimized digital edition PDF book. There are two ways
More informationChapter 1. Getting to Know Illustrator
Chapter 1 Getting to Know Illustrator Exploring the Illustrator Workspace The arrangement of windows and panels that you see on your monitor is called the workspace. The Illustrator workspace features
More informationFLIR Tools+ and Report Studio
Creating and Processing Word Templates http://www.infraredtraining.com 09-20-2017 2017, Infrared Training Center. 1 FLIR Report Studio Overview Report Studio is a Microsoft Word Reporting module that is
More informationAdobe InDesign CC. 1. Introducing the Workspace. 2. Getting to Know InDesign. 3. Setting Up a Document and Working with Pages
Adobe InDesign CC 1. Introducing the Workspace Getting started Looking at the workspace Working with panels Customizing the workspace Navigating through a document Using context menus Using Panel Menus
More informationOverview of Adobe Fireworks
Adobe Fireworks Overview of Adobe Fireworks In this guide, you ll learn how to do the following: Work with the Adobe Fireworks workspace: tools, Document windows, menus, and panels. Customize the workspace.
More informationHow to create interactive documents
Adobe InDesign Guide How to create interactive documents You can use Adobe InDesign to create dynamic web content or interactive documents. InDesign supports export to web-ready HTML or interactive PDF.
More informationChapter 4 Printing and Viewing a Presentation Using Proofing Tools I. Spell Check II. The Thesaurus... 23
PowerPoint Level 1 Table of Contents Chapter 1 Getting Started... 7 Interacting with PowerPoint... 7 Slides... 7 I. Adding Slides... 8 II. Deleting Slides... 8 III. Cutting, Copying and Pasting Slides...
More informationAdobe XD CC: Streamlining User Experience Design
Pfeiffer Report Benchmark Analysis : Streamlining User Experience Design The productivity impact of integrating Adobe XD into the UX development workflow. About this Research This report presents the findings
More informationDESKTOP PUBLISHING FOR PRINT PRODUCTION PRACTICAL
DESKTOP PUBLISHING FOR PRINT PRODUCTION PRACTICAL M Scheme By, A.Paramasivam, Lecturer (SS) S.Marimuthu, Lecturer Department of Printing Technology Arasan Ganesan Polytechnic College Sivakasi Ex.No. 1
More informationAdobe InDesign CC Voluntary Product Accessibility Template
Adobe InDesign CC Voluntary Product Accessibility Template The purpose of the Voluntary Product Accessibility Template is to assist Federal contracting officials in making preliminary assessments regarding
More informationCreating Reports in Access 2007 Table of Contents GUIDE TO DESIGNING REPORTS... 3 DECIDE HOW TO LAY OUT YOUR REPORT... 3 MAKE A SKETCH OF YOUR
Creating Reports in Access 2007 Table of Contents GUIDE TO DESIGNING REPORTS... 3 DECIDE HOW TO LAY OUT YOUR REPORT... 3 MAKE A SKETCH OF YOUR REPORT... 3 DECIDE WHICH DATA TO PUT IN EACH REPORT SECTION...
More informationDrupal Cloud Getting Started Guide Creating a Lab site with the MIT DLC Theme
Introduction Drupal Cloud Getting Started Guide Creating a Lab site with the MIT DLC Theme In this Getting Started Guide, you can follow along as a website is built using the MIT DLC Theme. Whether you
More informationPowerPoint Instructions
PowerPoint Instructions Exercise 1: Type and Format Text and Fix a List 1. Open the PowerPoint Practice file. To add a company name to slide 1, click the slide 1 thumbnail if it's not selected. On the
More informationACA Dreamweaver Exam Notes
ACA Dreamweaver Exam Notes Remember when you need to copy and paste the text you have to open up that actual text file itself and the need to go to edit> select all>, edit> copy>, then go back to the html
More informationArt170. Final Project Planning
Final Project Planning Projects For the Next Two Weeks During the next two weeks of this class, you are going to thoroughly prepare your final web project. If you plan all details, putting the site itself
More informationCognos. Active Reports Development. Presented by: Craig Randell
Cognos Active Reports Development Presented by: Craig Randell Objectives: Understand the purpose and benefits of Active Reports Through theory and demonstration introduce the different Active Report Components
More informationIntroduction to Microsoft Word 2008
1. Launch Microsoft Word icon in Applications > Microsoft Office 2008 (or on the Dock). 2. When the Project Gallery opens, view some of the available Word templates by clicking to expand the Groups, and
More informationAdobe Graphic Master. BIGROCKDESIGNS computer training consultants. Course Outline LEVEL: Section 1 Illustrator CC (Day 1 & 2) DURATION:
Adobe Graphic Master Course Outline This course has been created to provide the user with the skills required to incorporate all the packages of Adobe Creative Suite CC/CS6 so as to develop all print requirements
More informationIMPORTING, ORGANIZING, EXPORTING, AND SAVING. MyGraphicsLab: Adobe Photoshop CS6 ACA Certification Preparation for Visual Communication
IMPORTING, ORGANIZING, EXPORTING, AND SAVING MyGraphicsLab: Adobe Photoshop CS6 ACA Certification Preparation for Visual Communication OBJECTIVES This presentation covers the following ACA Exam objectives:
More informationOverview of the Adobe Dreamweaver CS5 workspace
Adobe Dreamweaver CS5 Activity 2.1 guide Overview of the Adobe Dreamweaver CS5 workspace You can access Adobe Dreamweaver CS5 tools, commands, and features by using menus or by selecting options from one
More informationHow to Prepare Your Cards for Press Using Scribus
How to Prepare Your Cards for Press Using Scribus This Tutorial is Divided into Sections: 1. What is Scribus? 2. What Do I Need to Get Started? 3. Setting Up Your Scribus Document 4. Creating Master Pages
More informationCreating Page Layouts 25 min
1 of 10 09/11/2011 19:08 Home > Design Tips > Creating Page Layouts Creating Page Layouts 25 min Effective document design depends on a clear visual structure that conveys and complements the main message.
More informationAdobe InDesign. Place multiple and keep in conveyor. Figure 1 Conveyor with collected items
How to reuse objects As a designer, you ll often find yourself reusing the same graphics, headlines, and pages. After all, one of your design goals is probably consistency or uniformity, and such uniformity
More informationIntroduction to Microsoft Office 2016: Word
Introduction to Microsoft Office 2016: Word Last Updated: September 2018 Cost: $2.00 Microsoft Word is a word processing software. You can use it to type letters, reports, and other documents. This class
More informationWorking with Images and Multimedia
CHAPTER Working with Images and Multimedia You can make your web page more interesting by adding multimedia elements. You can download the files featured in this chapter from www.digitalfamily.com/tyv.
More informationMuse Training for Webeditors
Muse Training for Webeditors 1. Install Muse through the Adobe Creative Cloud Suite 2. Saving/Sharing Processes - Dropbox or T: Drive>(website name) Folder>(either) Assets or Documents Muse file should
More informationGetting Started with Publisher 2013
1 Getting Started with Publisher 2013 Learning Objectives Get familiarize with the Publisher user interface Create publications from scratch or from templates Customize your template design to meet your
More informationGetting started with HotGloo (V5.0)
Getting started with HotGloo (V5.0) Your first steps to a whole new wireframing experience. 2016 HotGloo Wireframing with HotGloo Welcome dear wireframe rookie, sensei, guru or ninja. No matter which level
More informationAdobe InDesign CS6 Tutorial
Adobe InDesign CS6 Tutorial Adobe InDesign CS6 is a page-layout software that takes print publishing and page design beyond current boundaries. InDesign is a desktop publishing program that incorporates
More informationLava New Media s CMS. Documentation Page 1
Lava New Media s CMS Documentation 5.12.2010 Page 1 Table of Contents Logging On to the Content Management System 3 Introduction to the CMS 3 What is the page tree? 4 Editing Web Pages 5 How to use the
More informationCreating Vector Shapes Week 2 Assignment 1. Illustrator Defaults
Illustrator Defaults Before we begin, we are going to make sure that all of us are using the same settings within our application. For this class, we will always want to make sure that our application
More informationCreate and edit word processing. Pages.
Create and edit word processing documents with Pages. In this chapter, we begin to get work done on the ipad by using Pages to create and format documents. Creating a New Document Styling and Formatting
More informationCreateASite Beginner s Guide
Contents Getting Started... 3 Access the CreateASite Control Panel... 3 Select a Category/Subcategory... 4 Select a Template... 6 Change the Site Template... 10 Change Colours... 12 Change Fonts... 13
More informationLearning Adobe DreamWeaver CC. Module 1 Contents. Chapter 1: Introduction to DreamWeaver CC
Module 1 Contents Chapter 1: Introduction to DreamWeaver CC Design Considerations...1-1 Types of Graphics...1-2 Backgrounds and Text...1-2 Planning the Navigation...1-2 The DreamWeaver Screen...1-3 Workspaces...
More informationClassroom Blogging. Training wiki:
Classroom Blogging Training wiki: http://technologyintegrationshthornt.pbworks.com/create-a-blog 1. Create a Google Account Navigate to http://www.google.com and sign up for a Google account. o Use your
More informationInDesign CS4 is the sixth version of Adobe s flagship publishing tool,
What InDesign Can Do for You InDesign CS4 is the sixth version of Adobe s flagship publishing tool, a product that came into its own with the third version (CS, which stands for Creative Suite). Widely
More informationTechnical Case Study. Medieval Studies 1: Beginnings of English Q31207 (School of English Studies) WebCT Interface Design
Technical Case Study Medieval Studies 1: Beginnings of English Q31207 (School of English Studies) WebCT Interface Design Nuno Barradas Jorge Rich Media Group, IS Learning Team November 2007 01 1. Introduction:
More informationBasic Concepts 1. Starting Powerpoint 2000 (Windows) For the Basics workshop, select Template. For this workshop, select Artsy
1 Starting Powerpoint 2000 (Windows) When you create a new presentation, you re prompted to choose between: Autocontent wizard Prompts you through a series of questions about the context and content of
More informationAcrobat X Professional
Acrobat X Professional Toolbar Well Page Navigations/Page Indicator Buttons for paging through document Scroll Bar/box page indicator appears when using the scroll button to navigate. When you release
More informationInDesign Basics. Adobe
Adobe InDesign Basics Craig Polanowski 1. Begin by creating a new document. Chances are pretty good that you will want to turn off the facing pages setting and create single pages instead of spreads. One
More informationDreamweaver Basics. Planning your website Organize site structure Plan site design & navigation Gather your assets
Dreamweaver Basics Planning your website Organize site structure Plan site design & navigation Gather your assets Creating your website Dreamweaver workspace Define a site Create a web page Linking Manually
More informationMicrosoft Excel 2010 Basic
Microsoft Excel 2010 Basic Introduction to MS Excel 2010 Microsoft Excel 2010 is a spreadsheet software in the new Microsoft 2010 Office Suite. Excel allows you to store, manipulate and analyze data in
More informationInDesign CS Basics. To learn the tools and features of InDesign CS to create publications efficiently and effectively.
InDesign CS Basics InDesign Basics Training Objective To learn the tools and features of InDesign CS to create publications efficiently and effectively. What you can expect to learn from this class: How
More informationCreating Interactive PDF Forms
Creating Interactive PDF Forms Using Adobe Acrobat X Pro for the Mac University Information Technology Services Training, Outreach, Learning Technologies and Video Production Copyright 2012 KSU Department
More informationSHAW ACADEMY NOTES. Diploma in Lightroom
SHAW ACADEMY NOTES Diploma in Lightroom Diploma in Lightroom Lesson 7 Watermark, Exporting and Print Module Edit Watermarks In this section you can edit the text for the watermark. In any module, choose
More information:: MULTIMEDIA TOOLS :: CLASS NOTES
CLASS :: 04 02.15 2017 AGENDA :: Homework Upload [ A-2 ] Ultimate Composite! Upload A-2 Project to Student PSD Folder :: Photoshop Lesson 4: Creating a PSD Wireframe [Homepage] I. DOCUMENT SET-UP: a. Dimensions
More informationUsing Microsoft Word. Paragraph Formatting. Displaying Hidden Characters
Using Microsoft Word Paragraph Formatting Every time you press the full-stop key in a document, you are telling Word that you are finishing one sentence and starting a new one. Similarly, if you press
More informationSite Owners: Cascade Basics. May 2017
Site Owners: Cascade Basics May 2017 Page 2 Logging In & Your Site Logging In Open a browser and enter the following URL (or click this link): http://mordac.itcs.northwestern.edu/ OR http://www.northwestern.edu/cms/
More informationXerte. Guide to making responsive webpages with Bootstrap
Xerte Guide to making responsive webpages with Bootstrap Introduction The Xerte Bootstrap Template provides a quick way to create dynamic, responsive webpages that will work well on any device. Tip: Webpages
More informationCreating a Website Using Weebly.com (June 26, 2017 Update)
Creating a Website Using Weebly.com (June 26, 2017 Update) Weebly.com is a website where anyone with basic word processing skills can create a website at no cost. No special software is required and there
More informationAdobe Graphics Software
Adobe Graphics Software Untitled-1.indd 1 20.11.2015 13:05:28 Untitled-1.indd 2 20.11.2015 13:05:28 3 Recent versions have brought in functionality for working with 3D designs, though the program still
More information