Designer and Developer Workflow

Slides:



Advertisements
Similar presentations
Silverlight Presentation Mar 2008 PWC. Silverlight Introduction: Microsoft Silverlight is a cross-browser, cross- platform, and cross-device plug-in for.
Advertisements

© 2011 Delmar, Cengage Learning Chapter 7 Importing and Modifying Graphics.
Importing and Modifying Graphics
© 2010 Delmar, Cengage Learning Chapter 7: Importing and Modifying Graphics.
Dawn Pedersen Art Institute. Introduction Prior to Flash CS3, the movement of Illustrator and Photoshop documents into Flash was difficult. At that time,
Thomas Isler Microsoft
Sketching and Storyboarding IS 403 – Fall
Macromedia Fireworks MX 2004 – Design Professional WORKING WITH OBJECTS.
Work with multiple objects Modify color in objects Apply effects to objects and text Apply a style to objects Unit Lessons.
Expression Blend Rob S. Miles | Microsoft MVP | University of Hull, UK Andy Wigley | Microsoft MVP | Appa Mundi Session 4.0.
The Designer-Developer Workflow Martin Tirion User Experience Evangelist Microsoft.
Chapter 3 Survival Techniques. Goals Discover that being an Illustrator artist is more than just knowing the tools Develop a basic understanding of the.
Building Rich Interactive Applications Paul Laberge Partner Developer Advisor, Microsoft Canada
2 A First Look at Windows Presentation Foundation Everywhere ("WPF/E") Joe Stegman Lead Program Manager Microsoft Corporation.
Macromedia Fireworks 8 Revealed WORKING WITH OBJECTS.
Building Metro style UIs Paul Gusmorino Lead Program Manager Microsoft Corporation DEV354.
Testing Tools using Visual Studio Randy Pagels Sr. Developer Technology Specialist Microsoft Corporation.
Presentation VI Computer Communication By Teacher Julio Cesar Peñaloza Castañeda.
TYPES OF GRAPHICS TECHNOLOGICAL DESIGN. GRAPHIC DESIGN DEFINITION Visual problem solving that utilizes shapes, images, text, color, etc. to communicate.
T-Shirt Design Contest Bring Your Child To Work Day 2015.
Silverlight Technology. Table of Contents 1.What is Silverlight Technology? 2.Silverlight Overview. 2.1 How it works 2.2 Silverlight development tools.
1 Metro Style Apps in C++ Karthick 8 th May 2012.
Copyright © 2003 Pearson Education, Inc. Chapter 2, Slide 1 by Michael Kay The Web Wizard’s Guide to Flash.
Mr. Spaterella Technology Oct. 18
© 2000 – All Rights Reserved - Page 1 Adobe Illustrator 9.0 as a Web Prototyping Tool A new workflow for Web Graphics.
Presentation advances in.NET Framework 3.0 Mark Johnston Developer & Platform Group, Microsoft Ltd
Multimedia Elements –Graphics. Graphics in Multimedia Applications.
1 Digital Sales Solutions Design 101 Michelle Johnson, Internet Broadcasting July 2011.
I MPORTING AND M ODIFYING G RAPHICS. 1. Understand and import graphics 2. Break apart bitmaps and use bitmap fills 3. Trace bitmap graphics Objectives.
11in X 8.5in Resoultion:300 Color Mode: RGB Color 8 Bit.
Task 3 Store and Present Your Digital Entry Guidance Notes.
Introduction to Vector Graphics and Adobe Illustrator CS3
CSC/FAR 020, Computer Graphics, April 6, 2010 Dr. Dale E. Parson Outline for week 11 Illustrator Type, Pathfinder, Trace.
Contents : What is Silverlight? Silverlight Overview Silverlight Toolkit Overview Timeline & Packaging Silverlight V1.0 & V1.1 Properties of V1.0 Properties.
Task 3 Store and Present Your Digital Entry Guidance Notes.
Adobe Fireworks CS3 Revealed CHAPTER TWO: WORKING WITH OBJECTS.
Rudi Grobler Session Code: WUX201.
Desktop Publishing Part 2 Desktop Publishing Photoshop Skills Lesson4
Vector vs. Raster What’s the difference between vector and raster file formats? The real difference between the two formats is how they are used.
OV Copyright © 2012 Logical Operations, Inc. All rights reserved. Creating Raster Images  Draw with Brushes  Create Gradients  Use Tool Presets.
Making text photo. Photoshop tutorial: making text photo with Angelina Jolie's head- shot (Part 1) Step 1:  Select the picture you want to edit. Step.
An Introduction to Developing Applications for Microsoft Silverlight Jaime Rodriguez
Brennon Williams C.T.O. Splendid Expression Blend Design. Develop.
Visual Plastic Surgery Editing Portraits with Photoshop.
Eric Kincaid. Adobe Photoshop  Adobe Photoshop is a graphics editing program developed and published by Adobe Systems Incorporated.  1987-Thomas Knoll,
Design To Blend Dale G. Jones Director of Creative Design IdentityMine, Inc.
Unit 4 Design with Adobe Illustrator Introducing Adobe Illustrator Chapter Workshop Foundations  Work with Vector Graphics Work with Vector Graphics Workshop.
Evan Hutnick Session Roadmap  Introductions  Why this session?  Silverlight Developer  Silverlight Designer  How the tools.
Agenda 11/2/06 Digital Photography Free Response Warm Up Photoshop Lesson #3—More Layers –Review of Layers –More about Layers: Opacity and Blending Modes.
~80 System Colors (and Brushes) ~80 System Colors (and Brushes) XAML Control Colors Map to ~80 system colors SystemBaseHighColor (SystemControlHighlightBaseHighBrush)
Understanding Images. Pixels pixels Every image is made up of very small squares called pixels, and each pixel represents a color or shade. Pixels within.
Introduction to Silverlight Development Pavel Yosifovich CTO, Matrix Global; Senior Instructor, Hi-Tech College
Objective % Describe digital graphics production methods.
DoRon Motter Development Lead Microsoft Corporation
Building Windows 8 App.
Types of Graphics Technological Design.
OVERVIEW Objectives Follow a design document to prepare images for inclusion in a Web page Run a batch process to prepare multiple images in one step Use.
6/10/ :23 PM TOOL-504T A deep dive into Visual Studio 11 Express for designing Metro style apps using XAML Joanna Mason & Unni Ravindranathan Program.
Graphics: Production Methods, software, & Hardware
From Concept to Production: Prototyping with Blend 3 & SketchFlow
setting the resolution - 72 vs 300 dpi (300 better quality)
Affordable Adobe Presented by: Gail Dunn
Adobe Visual Design 1.00 Setting project requirements using Photoshop (3%) 6.00 Setting project requirements using Illustrator (1%)
Silverlight Technology
MIX 09 11/23/ :24 PM © 2009 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered.
Blending Images.
Objective % Describe digital graphics production methods.
Trivia 1 Photoshop.
Windows Forms in Visual Studio 2005: An in-depth look at key features
CSC/FAR 020, Computer Graphics, November 18, 2009
Presentation transcript:

Designer and Developer Workflow

Designer & Developer Workflow Designer Developer XAML

What are we enabling? People to build great applications

Functional Reliable Scalable Secure Performance Functional Reliable Scalable Secure Performance What makes a great application? Core Architecture Delights the user Easy to use Powerful Focused Flexible Delights the user Easy to use Powerful Focused Flexible User Experience

Production Design & Development Workflow Prototype Core architecture : Visual Studio User Experience : Expression Blend Core architecture User Experience

Design & Development Workflow Production Prototype Core architecture : Visual Studio User Experience : Expression Blend

Design & Development Workflow Production Prototype Core architecture : Visual Studio User Experience : Expression Blend

Design & Development Workflow Production Prototype Core architecture : Visual Studio User Experience : Expression Blend

Design & Development Workflow Production Prototype Core architecture : Visual Studio User Experience : Expression Blend

Delivering the experience… Visual Studio Development team Expression Blend Design Generalist Visual Studio Development Team Expression Blend Design Specialist How enable?

Enable design time data for the designer

Demo: Design time data

Photoshop/Illustrator Import Layers. Expression Blend preserves layer names, importing the layers as individual objects and layout containers Text. When you are importing Photoshop files, text can be imported as editable text objects or as flat bitmap images. Vectors. Vector art can be imported as editable path objects. Photoshop files can also be imported as images. Blend Modes. When you are importing Photoshop files, layers that contain blend modes can be merged. Gradients. Linear and radial gradients remain editable after they are imported. Color stops are imported as gradient brushes. Opacity stops imported as gradient brushes to the OpacityMask property. Patterns. Patterns are imported as image brushes.

Behaviors

Demo: Behaviors

Prototyping If Ernest Hemingway, James Michener, Neil Simon, Frank Lloyd Wright and Pablo Picasso could not get it right the first time, what makes you think you will? Paul Heckel

Demo: SketchFlow

Creating a great Experience Production Prototype Core architecture User Experience Visual Studio Expression Blend SketchFlow PSD, AI, Paper Client 1: Ideas 2: Resources 3: Project

Creating a great Experience Production Prototype Visual Studio Expression Blend SketchFlow PSD, AI, Paper ALM/Visual Studio Team System Specs, Requirements Deployment