Index

„„ A Output tab, 257 Security tab, 258 ActionScript 3.0 Summary tab, 259 import audio, 460 Adobe Phone GAP Build, 997 Library panel, 460–461 Adobe Portfolio, 995–996 Properties panel, 462 Adobe programs, 28 repeat sound, 466 , 996–997 Sound Effect settings, 463–464 Advanced export settings, 650 Sync Setting, 465–466 Animate CC CC, 185 actions panel, 573–574 blending effects, 447–448 console apps, 4 Character Animator CC, 384 definition, 3 code (see Code snippet panel) five core programs, 6 Creative Cloud, 382–384 maze, representation, 3 Display Render, 448–449 simplified maze, 8 Display Tab, blending options, 444–446 software maze, 9 effects software programs, 6–7 color, 442–444 web file formats (see Web file formats) properties panel, 437 website creation, 5 symbols, 438–442 Adobe Creative Cloud panel, 960 export options, 383 Adobe Creative Cloud Software External library, 411 Adobe Experience Design, 994–995 Filters Adobe InDesign CC, 994 Adjust Color filter settings, 455 Adobe knowledge, 994 Bevel filter settings, 453–454 Adobe Portfolio, 995–996 options, 450 five core Adobe programs, 993 save settings, 456 Phone GAP Build, 997 settings, 450–452 quiz, 997–1000 FLA file Spark for storytelling, 996–997 opening, 386–387 , 5 settings, 388 Adobe Experience Design, 994–995 templates, 389 (.ai, .ait), 236 flashing graphics, 595 Adobe InDesign CC, 994 History panel Adobe LiveMotion, 382 create basic commands, 579 Adobe Media Encoder, 147, 160, 186, 459, 676 Manage Saved Commands, 579–580 Adobe PDF (.), 236 HTML5 Canvas file (see HTML5 Canvas) Advanced tab, 257 import file formats, 410 Bleeds tab, 256 import images, 411 Compression tab, 256 Libraries panel, 581 General tab, 255 Flash, 382 Marks tab, 256

© Jennifer Harder 2018 1001 J. Harder, Graphics and Multimedia for the Web with Adobe Creative Cloud, https://doi.org/10.1007/978-1-4842-3823-3 ■ INDEX

Animate CC (cont.) Appearance panel, 250 Preferences panel, 571–572 Artboards, 88–90 RAW files choose number of, 265 FLA conversions ActionScript to export sizes, 269 HTML5, 396–398 mode, 267 Library panel, 394–395 panel, 267 Properties panel, 392–394 PDF, 275 Timeline panel, 394 screens dialog box, 268 Tools panel, 395–396 thumbnail buttons, 268 RGB two in one file, 266 adding color, 399 Art brush, 587 Color panel, 403 Artwork Color Picker, 400 Illustrator CC gradient, 404, 405 blending modes, 417–419 Info panel, 407 effects FX, 420–421 Properties panel, 401–402 import Swatches, 406 button option, 422 Tools panel, 400–401 layers, 422–427 workspace, setting, 384–386 output, 428 Animated GIF Timeline panels, 429 publish tab, 702 import Illustrator AI video tab, 701 bitmap, 435 Animate timeline, 473–474 files, 432 Animations, CSS3 incompatibility report, 434 animation-delay, 842 layers, 430–431, 433 animation-direction, 842 objects, 436 animation-duration, 843 Photoshop CC animation-fill-mode, 843 blending modes, 412–414 animation-iteration-count, 843 layer, 416–417 animation-name, 843 Assets tab animation-play-state, 843 export for screens, 276 animation-timing-function, 843 export layers panel, 281–282 backward, 843 export panel, 276–281 both, 843 Audio convertion to export settings class (.easeinAnimObj), 844 MP3 cubic-bezier(n,n,n,n), 844 audio tab, 685

tag, 841 effects tab (see Effects tab settings) ease-in, 843 export setting dialog box, 680 ease-in-out, 843 options, 680 ease-out, 843 preview settings, 681–682 forward, 843 publish tab, 685 @keyframes, 842 summary settings, 682 linear, 843 time code settings, 685–686 none, 843 Waveform Audio (.wav) step-end, 844 audio tab, 688 steps(int,start|end), 844 effects tab, 687 step-start, 843 export and summary transitions and CSS effects, 840 settings, 686–687 W3Schools, 841 publish tab, 689 Animation tools time code settings, 689 GIF animation, 127 Audio CSS aural, 940 static GIF images, 323 Audio files (MP3, WAV, Ogg), 10 SVG interactivity panel (see SVG interactivity Audio frames, 496 panel) Audio MP3 File timeline panel (see Timeline panel) factors, 723

1002 ■ INDEX

media encoder CC create, 512–513 add queue panel, 724 flower stock bends, 515 add source icon, 706 joint movement, 514–515 animation clip, 710 nested animations, 516 AVI file, 714 Bootstrap encoding panel, 722 Behaviors panel, jQuery effects, 900 export audio, 708, 715, 726 components export settings, 708, 710–711, 714, 716, Insert panel, 904–905 721–722, 726–727 Snippets panel, 901–902 FLA TO MOV file, 709 create mobile site, 903–904 frame rate, 718–719 CSS, JavaScript and jQuery files, 904 glass canes, 713 front-end framework, 901 guide images, 711–712 HTML elements, 903 MOV video file, 715 images and fonts, 905 output file, 707 Insert panel, 899–900 remove files, queue panel, 706 Site Setup dialog box, 902 reset status, 722–723 Box-shadow, 834–835 source scaling, 719–720 video duplication, 725 video tab, 717 „„ C video to MP3, 724 Camera tool waveform audio, 725 color effects, 510 Audio tab settings layer properties dialog box, 486–487 ACC and MPEG modes, 509 advanced settings, 666 motion tween and, 495, 504–507 basic audio settings, 664 properties menu, 510 advanced settings MPEG de-emphasis, 666 Reset Essentials, 509 audio format settings, 664 Canvas, 10 bitrate, 665 Captions tab settings, 667 Audio Video Interleave (AVI), 642 Carousel gallery Auto slices, 307 bootstrap-4.0.0. file, 983 Bootstrap and jQuery files, 980 Bootstrap component, 980 „„ B copy dependent files, 980–981 Bind tool, 516, 518–519 create HTML page, 980 Bit depth, 32 default, 982 Bitmap (.bmp), 32, 50, 52, 233, 283 font size, 984 defined, 9 gallery.html, 985 sequence export settings image link, alt tag, heading

, and caption caption tab, 694–695

, 982 color effect, 693–694 inserted carousel code, 981–982 FTP, 695 JavaScript code, 983 time code, 695 JavaScript files, 985 video frame, 694 layout and CSS properties, 984 Bitmap fill, 405 lightboxes and modal images, 986 Blank frame, 492 Live view, 980 Blank keyframe, 492 locked CSS file, 984 Bone tool speed of, 984–985 armature website, adding, 979 add points, 512 W3Schools, 983 IK, 511 Cascading Style Sheets (CSS), 110, 286–287 layer, 488 column count, 878 Illustrator CC export options, 286–287 add shapes to stage, 513 image slices and mobile devices, 870–871 copy and cut poses, 516 media queries (see Media queries)

1003 ■ INDEX

Cascading Style Sheets (CSS) (cont.) indexed color, 55–56 print, CSS Designer Panel, 878–879 amount, 61 properties panel, 288–290 dither, 60 viewport matte background option, 59–60 content, 866 palette drop-down menu, 56–58 initial-scale=1, 866 forcing colors, 58–59 Insert panel, HTML tab, 865 transparency option, 59 meta, 866 CSS3 Properties panel, 866 animations (see Animations, CSS3) CC Libraries panel, 958 background images, 830 Character Animator CC, 384 Bootstrap files, 828 Classic tween, 494, 502–504 borders, 830–831 Closed captioning (CC), 667 box-decoration-break, 834 CMYK (cyan magenta, yellow, box-shadow, 834–835 black), 11, 32 custom bullets Code snippet panel content property, 838 bitmap file, 576 GIF animation, 839 button symbol, 575–576 list item bullets, 838 HTML5 Canvas, 574 property list-style, 839 properties panel, 574 pseudo class, 839 wizard, 577–578 W3Schools, 839 Color blindness proofs, 359–360 description, 827 deuteranopia (green loss), 197 HTML5 shiv, 827 monochromacy (all color loss), 199 image masking, 838 protanopia (red loss), 197 tag, 828–830 Color dialog box, 38 Internet Explorer/Edge, 828 Color effects, 510 outline CSS2, 833–834 Color Guide panel, 247 resources, CSS Snippets, 827–828 Color mode rounded borders, 831–833 assign profile, 34, 242 text-shadow, 835–836 Bitmap, 32 CSS Designer panel CMYK to RGB, 242–243 access color picker, 812 display file name, 242 background-color, 809–811 Duotone, 36 body tag, add properties, 812–813 grayscale, 32 color picker and helpful hints, 811 HEX color, 37–38 internal style sheet, 807–808 Index Color, 36–37 Selectors tab, 808 Lab, 32 add properties, 809 Multichannel, 36 selector rule, 809 pixel aspect ratio, 34 type in, 808 RGB, 32, 34 source, media, selectors and selection tool, 242 properties, 806–807 web images, 239 CSS Filters settings, 241 blur(px), 836 Color panel brightness(%), 836 color picker, 244–245 contrast(%), 836 mode change, 243–244 Dreamweaver’s Snippets panel RGB setting, 244 (CSS Effects), 837 Color Themes panel, 248 drop-shadow(h-shadow v-shadow blur spread Column count, 878 color), 836 Combining video clips, 676 grayscale(%), 837 Comment frames, 496–497 hue-rotate(deg), 837 CompuServe GIF invert(%), 837 color picker, 58 None, 836 color table’s eyedropper tool, 58 opacity(%), 837

1004 ■ INDEX

saturate(%), 837 3D transform sepia(%), 837 backface-visibility, 857 url(), 837 matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n), 858 W3Schools, 837 perspective, 856 CSS floats perspective(n), 858 clip, 864–865 perspective-origin(x%,y%), 857 light box/modal image, 861 rotate3d(x,y,z,angle), 858 Photoshop CC and layers, 861 rotateX(angle), 858 position properties rotateY(angle), 858 absolute, 863 rotateZ(angle), 858 CSS Designer panel, 862 scale3d(x,y,z), 858 fixed, 863 scaleX(x), 858 position, 863 scaleY(y), 858 relative, 863 scaleZ(z), 858 static, 863 transform, 856 sticky, 863–864 transform-origin(x%,y%,z), 856 property, 861 transform-style, 856 z-index, 864 Transition dialog box, 858–859 CSS Transitions panel, 846–847 translate3d(x,y,z), 858 Edit Transition dialog box, 852–853 translateX(x), 858 HTML document, 847 translateY(y), 858 New Transition dialog box, 847–848 translateZ(z), 858 document/new style sheet file, 851 2.5D Parallax Effect, 171 drop-down menu, 849 3D tools, Animate CC, 591–592 Edit mode, 849 3D tweening, 495 end value, 851

tag, 777 end value properties, 850 code view, 778 height/background color, 850–851 creating structure, 777 set duration, delay, and timing design view, 779 function, 849–850 Properties panel, 779 Target Rule, 848 using insert div dialog box, 778 Transition On, 849 using insert panel, 777, 779 remove transition dialog box, 852 Dreamweaver CC (Dw), 7, 961 save transitions, 853 Adobe GoLive, 736 transition button, creation, 852 Advanced Settings tab, 754 Files panel, 755 fixing errors, 756 „„ D Help menu, 737 Dimensions (Dn), 7 Hot Glass Tango, 737, 753 2D transform HTML5 (see HTML5) Code view, 856 Install button, 737–738 matrix(n,n,n,n,n,n), 854 maze center, 733–734 rotate(angle), 855 and Muse CC, 734–736 scaleX(n), 855 open, Creative Cloud console, 738 scale(x,y), 855 Properties panel, 738–740 scaleY(n), 855 save file, HTML document, 754 skewX(angle), 855 Servers tab, 753 skew(x-angle,y-angle), 855 Site setup Site tab, 752 skewY(angle), 855 templates, 747 transform, 854 toolbar, 740–741 transform-origin(x%,y%), 854 apply comment and remove comment, 743 Transition dialog box, 855 Customize Toolbar dialog box, 744 translateX(n), 854 expand all, 743 translate(x,y), 854 file formats, 747 translateY(n), 854 File Management, 741

1005 ■ INDEX

Dreamweaver CC (Dw) (cont.) SVG, 535–536 Format Source Code, 743 SWF movies, 532 new document, 747 Web (Legacy) option open documents, 741 Animate CC, 525 Preferences panel, 745 GIF image, 528–529 Quick Start tab, 746 file size, 528 Toggle Visual Media Queries Bar, 742 HTML file, 526–527 Toolbars Standard panel, 745 JPEG image, 530 Turn on Live view and inspect mode, 742–743 layout, 526 View Live Options, 741–742 PNG-8 and PNG-24 settings, 530–531 workspace, 738 presets, 528 Duotone, 36 tools, 526 Web dialog box, 526 Export settings dialog box. See also Audio tab „„ E settings Effects tab settings advanced format settings, 649 image overlay, 653–654 advanced settings, 651 loudness normalization, 659 captions tab, 667 Lumetri Look/LUT, 651–652 effects tab (see Effects tab settings) MP3 format name, 644 loudness normalization, 684 metadata, 674–675 time tuner, 683 multipexer tab settings, 667 name overlay, 654–655 output tab, 646 SDR Conform, 652 preview settings, 646 text overlay, 655 publish tab (see Publish tab settings) timecode overlay, 656–657 render alpha channel, 673 time tuner, 657 render quality, 673 video limiter, 658 source tab, 644–645 Embedded OpenType Fonts (EOT), 954 time interpolation, 673 Encapsulated Postscript (EPS), 236 video tab (see Video tab settings) Encoding panel, 636 External CSS Enhanced metafile (.emf), 236 CSS Designer panel EPUB (.epub), 10 attached to webpage, 825 Event, 465 Attach Existing CSS file, 826 Export files attaching, 824 animated files, 523–524 color and background images, 825 Animated GIF create/add existing style sheet, 822 audio, 542 create new CSS file and save, 822–823 flower_stock.fla file, 542 link of background image, 825–826 graphic, 542 new CSS file, 824 options, 541–542 remove internal styles, 822 settings, 541, 542 File ➤ New ➤ CSS, 827 File ➤ Publish option, 525 issues, 821 HTML5 Canvas (see HTML5 Canvas) overriding background/link color, 821 Movie (see Movie) Extraction of code from layers options, library panel (see Library panel, CSS information, 190 export files) SVG data, 190 Video (see Video) Extract PSD panel, 958–960 Web export options (see Web export options) Export Image Image (Legacy) „„ F GIF, 533 File conversion process JPEG, 532 Actions panel photoshop, 532 image size, 101, 105 PNG, 534 JPEG option, 103–104

1006 ■ INDEX

mode conversion, 106 „„ H new action set, 96–98 recording, 98–100 Hexagonal tile, 349 Automate Batch Actions, 106–107 HEX color, 37–38 Automate Droplet Actions, 107–109 Hot Glass Tango, 361, 708 Illustrator CC action panel action recording, 301 AI file, 368 action set creation, 300–303 GIF files, 363 actions panel, 298–299 GIF selective diffusion 256, 363–364, 367 SVG options dialog GIF settings, 365–366 box, 301–302 image preview, 368 Flash/Flash Application, 388 recording, 364, 366 Flashing graphics, dangers of, 595 visibility, 366–367 Flash SWF and Flash video, 947 web (legacy), 364 Frame Picker panel, 519–520 carousel gallery (Bootstrap) (see Carousel Frames per second (fps), 178 gallery) Free fonts, 953 gallery image average size, 201–202 exporting, 202–206 „„ G GIF, 201 GIF files, 127 PNG and JPEG, 201 GIF (static) image sequence export PSD file, 202 settings, 699–700 GIF (see Graphic interchange format (GIF) Glyphs panel, 343 animation) Google Charts, 951 GIF 64 Dither, 362–363 Gradient fills, 403–404 GIF animation Gradient panel, 248–249 Layers panel, 206–207 Graphic file formats, 456 save animation, 208 Graphic interchange format (GIF) animation settings, 208 Adobe Animate CC, 129 timeline, 207 benefit, 597 GIF image, 362 color reduction algorithm, 79–80 HTML5 Canvas (see HTML5 Canvas dither algorithm, 80–81 animation) drawback, 597 HTML5 video export, 72