TechEd 2013 1/2/2019 10:58 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks.

TechEd 2013 1/2/ :58 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Getting a Designer/Developer Workflow That Works
1/2/ :58 PM DEV-B208 Getting a Designer/Developer Workflow That Works Chris Klug @ZeroKoll © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Who is that guy? TechEd 2013 1/2/2019 10:58 PM
© 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Juicy Salif Source: Alessi

Philips HR2744/40 Source: Alessi

Philips HR2752/90 Source: Alessi

By S. SAMNAD. S (Own work) [CC-BY-SA-3. 0 (http://creativecommons
By S.SAMNAD.S (Own work) [CC-BY-SA-3.0 ( via Wikimedia Commons By Miosw (Own work) [CC-BY-SA-3.0 ( via Wikimedia Commons By FanHabbo (Own work) [CC-BY-SA-3.0 ( via Wikimedia Commons By Pietro Schirano [Attribution], via Wikimedia Commons

“There is no such thing as no design, only bad design”

I believe… TechEd 2013 1/2/2019 10:58 PM

I don’t believe… TechEd 2013 1/2/2019 10:58 PM

Disclaimer Feelings might get hurt during presentation due to the speakers generalizations and assumptions. Do not feel bad if they do. Generalization and assumptions are used to simplify and highlight…

Logical / Developer

Creative / Designer

The “Players”

Developer “Makes it work” Builds functionality Writes code Adds bugs Fixes bugs

Designer “Makes it an experience” Defines application layout Ensures usability Creates visual design Adds “client feeling”

Communication Team lead Development team “Product owner”

Communication Customer “Product owner”

Tools Visual Studio Expression Blend Team Foundation Server Bing/Google

Tools Paper & Sharpie Balsamiq Adobe Suite (Expression Design)

Combining left & right Introducing the “devigner”

Devigner “Converts visuals to functional UX” Adds transitions and other UX features Combines data and functionality from the VM in the View

Communication Development Team Designer Customer

Tools Adobe Suite Expression Blend Visual Studio Team Foundation Server

Enough fluff…

Tweet-a-licious A desperately contrived example using Twitter

Client approval

Pulling wireframes apart But…we just built them…

public class MainViewModel {
public string TweetText { get; set; } public bool IsLoadingTweets { get; } public IEnumerable<TweetViewModel > Tweets { get; } public bool IsLoadingAuthor { get; } public AuthorViewModel SelectedAuthor { get; } public ICommand ShowFeed { get; } public ICommand ShowMessages { get; } public ICommand ShowFavorites { get; } public ICommand SendTweet { get; } }

public class TweetViewModel {
public string Text { get; } public string Author { get; } public DateTime Published { get; } public ImageViewModel Avatar { get; } public ICommand Reply { get; } public ICommand Retweet { get; } public ICommand Favorite { get; } public ICommand ShowAuthor { get; } } public class ImageViewModel { public ImageSource Image { get; } public bool IsLoading { get; }

public class AuthorViewModel {
public string Name { get; } public string Handle { get; } public string Introduction { get; } public ImageViewModel Avatar { get; } public int TweetCount { get; } public int FollowCount { get; } public int FollowerCount { get; } public bool IsLoadingTweets { get; } public IEnumerable<TweetViewModel > Tweets { get; } public ICommand Follow { get; } }

Outcome? Mutual understanding, love and peace…and VM-stub interfaces of course…

Time to multitask Finishing early is often appreciated when it comes to software development

Create visual design TechEd 2013 1/2/2019 10:58 PM

Set up Set up solution Create stub VMs Create basic UI Configure basic UI to use stubs

Be helpful

Demo: Dev UI and stub VMs
TechEd 2013 1/2/ :58 PM Demo: Dev UI and stub VMs © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Hand over visual design Hand over visual design to “devigner” Explain visual design to “devigner” Go into supporting mode

Create application structure Add frameworks Set up DI etc

Get understanding of visual design

Demo: Setting up DI TechEd 2013 1/2/2019 10:58 PM

Implement functionality Define & implement services Implement VM functionality

Convert Visual Design To XAML/HTML Add transitions etc to UI Behaviors, jQuery etc

Demo: Styling the UI TechEd 2013 1/2/2019 10:58 PM

Switch application from stub VMs to real VMs

Demo: Setting up VM location
TechEd 2013 1/2/ :58 PM Demo: Setting up VM location © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Application done! It might not be bug free, but it is running…

TechEd 2013 1/2/ :58 PM Potential tweaks Duplicate views Automated view tests Design-time data from Blend Merging roles Conditional design-time assembly reference © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

TechEd 2013 1/2/ :58 PM Considerations When to introduce roles during project Behavior library Design-time data differences between Blend & VS © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Questions. ”There is no such thing as a stupid question” chris@59north
Questions? ”There is no such thing as a stupid

1/2/ :58 PM Font info Font, size, and color for text have been formatted for you in the Slide Master This template uses Segoe UI and Segoe UI Light, standard fonts included in Windows 7 If you are running Windows 7 or 8, no fonts are needed. If you are running Windows Vista or earlier, you will need to install Segoe UI Light. When connected to CorpNet, you can find Segoe UI here: \\showsrus\images\Corporate_Fonts\PC\Segoe UI\Segoe_UI_Font_family Copy the .ttf fonts into your C:\Windows\Fonts folder © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Presentation fonts/typography
1/2/ :58 PM Presentation fonts/typography What are the font choices and sizes? Any font size 28pt or larger should use Segoe UI Light Any type that is less than 28pt should use Segoe UI On one slide, try to use a maximum of 3 font sizes Where to start Control focus by using scale versus bullets Use color to draw focus when necessary Start with main topic at 40pt and subtopics at 20pt Title/sentence casing and periods Title text should be “sentence case” All supporting slide text should be sentence case except for names and products © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Accent colors 1-6 – (6 Theme Colors to the far right)
1/2/ :58 PM Slide palette info The PowerPoint palette for this template has been built for you and is shown below. Avoid using too many colors in your presentation. Select the 4th color from the left for subheads and 1st level non-bulleted text color, or wherever “color” text is preferred over the default black/white text Accent colors 1-6 – (6 Theme Colors to the far right) Text Light 2 Accent 1 Accent 2 Accent 3 Accent 4 Accent 5 Accent 6 Use Accents 4-6 sparingly – only when more colors are necessary Use Accent 1 as the main accent color. Use Accent 2 and Accent 3 when additional colors are needed. © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Preferred text layout (no bullets)
1/2/ :58 PM Preferred text layout (no bullets) Main topic 1: size 40pt Size 20pt for the subtopics Main topic 2: size 40pt Main topic 3: size 40pt © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Adjusting list levels Main topic 1: size 40pt Main topic 2: size 40pt
1/2/ :58 PM Adjusting list levels Main topic 1: size 40pt Size 20pt for the subtopics Main topic 2: size 40pt Main topic 3: size 40pt Use the “Decrease List Level” and “Increase List Level” tools on the Home Menu to change text levels. Try this: Place your cursor in any row of text to the left that says “Size 20pt for subtopics” Next click the Home tab, and then on the “Decrease List level” tool. Notice how the line moves up one level. Now try placing your cursor in one of the “Main topic…” lines of text. Click the “Increase List Level” tool and see how the text is pushed in one level Use these 2 tools to adjust your text levels as you work © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Bullet points layout Subtitle
1/2/ :58 PM Bullet points layout Subtitle Example of a bulleted slide with a subhead Set the slide title to “Sentence case” Set subheads to “Sentence case” In “bulleted” slide layouts, level 2 text is 20pt Level 3 text is 20 pt Level 4 text is 18pt Level 5 text is 18pt Hyperlink style © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Type that is size 54pt and larger should be condensed by 1pt
1/2/ :58 PM Character spacing Type that is size 54pt and larger should be condensed by 1pt Type that is smaller than 54pt should be normal © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

1/2/2019 Chart Example © 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

1/2/ :58 PM Software code slide This slide layout uses Consolas, a monotype font which is ideal for showing software code. © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

1/2/ :58 PM Demo Name © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

1/2/ :58 PM Video © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

1/2/ :58 PM Section title © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Resources Learning TechNet msdn http://channel9.msdn.com/Events/TechEd
1/2/ :58 PM Resources Learning Sessions on Demand Microsoft Certification & Training Resources TechNet msdn Resources for IT Professionals Resources for Developers © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Complete an evaluation on CommNet and enter to win!
1/2/ :58 PM Complete an evaluation on CommNet and enter to win! © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

1/2/ :58 PM Required Slide *delete this box when your slide is finalized Your MS Tag will be inserted here during the final scrub. Evaluate this session Scan this QR code to evaluate this session and be automatically entered in a drawing to win a prize © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

1/2/ :58 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION. © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

TechEd 2013 1/2/2019 10:58 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks.

Similar presentations

Presentation on theme: "TechEd 2013 1/2/2019 10:58 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks."— Presentation transcript:

Similar presentations

About project

Feedback

Log in

Auth with social network:

TechEd 2013 1/2/2019 10:58 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks.

Similar presentations

Presentation on theme: "TechEd 2013 1/2/2019 10:58 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks."— Presentation transcript:

Similar presentations

About project

Feedback