Handboek XAML Archieven - io independent publisher

Typography in Silverlight 5

Silverlight 5 is released and contains the Typography features that already existed in WPF. Designers can use these features to make beautiful typographic designs.

Thanks to the qualities of the OpenType font format, several typographic features are now available to every web designer. Combining TrueType and Postscript outlines in one format, smaller file sizes, more typographic control and allowing far more characters in a single font file have resulted in a much more versatile use of fonts. The Typography object is available to you inside a TextBlock or TextBox tag. Attributes of this object lead to various typographic results.

Inside a TextBlock or TextBox, a Run element is used that can only contain unformatted text. Properties of the Typography object are applied through this Run element. To group some of the Run elements together, use a <Span>. Both Run and Span have no inherent rendering.

One concept associated with typography is Kerning . Kerning is embedded in the selected font file and Silverlight has no influence on it other than being able to use it or not. You can set the Typography.Kerning attribute to False. The default setting is True.

Superscript and Subscript are Variants of normal characters in a font, placed on respectively a higher or lower baseline than the rest of the text. Other Variants are Normal, Titling, Inferior, Ordinal and Ruby. Note that a Superscript and a Subscript Variant needs to be present in the font file you use.

Nobody should use a smaller font size of normal Capitals when you really need SmallCaps. Spacing of SmallCaps is different and weight and proportion of the letters are adapted to their size and use. Also, for titling purposes capitals with elegant, slender stems are possible, if they are accounted for in the specified font. Setting the property Typography.CapitalSpacing=”True” is a good idea for titles or text that are in capitals, for the spacing between capitals and lowercase letters differs from the spacing between all capitals.

Ligatures are Alternates for two characters that would collide when spaced normally. In the lowercase combination of f and i for example, the point of character i interferes with the end of the stroke of the f regularly. So in the ligature ﬁ this issue is solved. The same is true for ﬀ, ﬂ, ﬃ, ﬄ and many other character combinations. In OpenType fonts standard ligatures are enabled by default in Silverlight 5. If for some reason standard ligatures should be disabled, use the property Typography.StandardLigatures=”False”. Other reasons for ligatures are esthetic, resulting in discretionary or historic ligatures, using Typography. DiscretionaryLigatures and Typograpy.HistoricalLigatures. Ligatures must be present in the font file for you to make them visible with the Typography object.

Swashes are decorative elements of characters associated with calligraphy. Extended serifs and strokes on existing characters may be part of your OpenFont file. To enable a Swash on a character set Typography.StandardSwashes=”1”. When a standards Swash doesn’t result in an agreeable result setting Typography.ContextualSwashes=”1 for that character is also an option.

OpenType has so many positions for characters available, that Stylistic Alternative characters are at your disposal. To enable an alternative character, set the Typograhy.StylisticAlternates property. Random use of alternatives is possible when you specify Typography.ContextualAlternates=”True”, a great way to help a script font in suggesting true handwriting. A font may also contain AnnotationAlternates. These are Glyphs in circles, squares, parentheses, diamonds or rounded boxes used for annotation of images of illustrations. In code-behind this index can be set with Typography.AnnotationAlternates.

Some characters in a font may be designed to be used together, because they look better next to each other or work together somehow. These characters are combined in a stylistic set and a maximum of 20 of these sets may be set in code-behind.

Numerical features of OpenType include Typography.Fraction=”Slashed” or Typography.Fraction=”Stacked”, old style numerals with Typography.NumeralStyle=”OldStyle” inside a Run tag and Tabular or Proportional alignment with Typography.NumeralAlignment=”Tabular” and even, where available, a slashed zero using Typography.SlashedZero=”True”.

Here’s the XAML I used for the image at the beginning:

[sourcecode language=”XML”]

[/sourcecode]

Also check out Silverlight 5 OpenType Support from Pete Brown at 10REM.NET.

Njoy!

Silverlight en Expression Insiders, de user group voor Silverlight Designers

Als je een groep van vakbroeders in Silverlight en Expression Studio wel ziet zitten, laat dan je e-mail adres achter op de Sixin site, zodat we je op de hoogte kunnen houden van de ontwikkelingen.

Sinds Silverlight 1.1 in beta uitkwam, is mijn doel geweest om mooie en krachtige internetapplicaties te maken met de Expression tools en Silverlight. Gelukkig sluit dat aan op mijn werkzaamheden als senior designer bij Macaw, waar we de afgelopen jaren veel mooie WPF- en Silverlight-projecten hebben mogen uitvoeren voor verschillende opdrachtgevers. Ik ben er van overtuigd dat Silverlight ongekende mogelijkheden biedt om indrukwekkende userinterfaces te creëren. Juist dat ongekende houdt me bezig. Daardoor schrijft in artikelen, waarin in webdesigners van Nederland probeer te vertellen wat je allemaal kan creëeren en bereiken met XAML als taal, Silverlight als techniek en Expression Studio als tools. Daarom is het ook logisch dat ik bestuurslid ben van de Silverlight en Expression Insiders.

Ik verwacht dat er meer ontwerpers zijn als ik. Ik heb groot respect voor de software die Adobe in de markt zet. De Creative Suite is onmisbaar als het gaat om de creatie van bitmap- en vectorillustraties. Zelf gebruik in geen Mac, maar heb er in het verleden wel mee gewerkt en vind het mooie apparaten. Vanuit mijn werk en de relatie van mijn werkgever met Microsoft is het gebruiken van een Mac op z’n zachts gezegd onhandig. Als ontwerper bedien ik uitsluitend klanten die al voor het Microsoft platform hebben gekozen om hun zakelijke applicaties op te draaien. Het is logisch dat de taal, techniek en tools voor het creëren van deze software ook op het Microsoft platform draait. Met Expression Studio en Silverlight is dat realiteit.

Maar waar zijn die andere ontwerpers op het Microsoft platform? Ontwerpers die, behalve met de Creative Suite, met Expression Studio en Silverlight hun werk doen? Tot voor kort was er geen echte user group voor deze ontwerpers. Ik verwacht dat ze vanuit de developers discipline komen en verknocht zijn geraakt aan de interface naar gebruikers. Of het zijn ontwerpers, zoals ik, die voornamelijk voor het Microsoft platform werken. Met de Silverlight en Expression Insiders (Sixin) is er nu een user group voor deze ontwerpers. Mensen die lid zijn van de Adobe User Group kunnen heel goed ook lid zijn van de Sixin, net als ik naast Expression Design en Blend bijna dagelijk met Photoshop en Illustrator werk. In een komend SDN Event laat ik Blending Creative Suite en Expression Studio zien.

Ik ben op zoek naar vakbroeders, die ook de nieuwe mogelijkheden in Silverlight 4 willen ontdekken en in bijeenkomsten en discussies op de hoogte blijven van de ontwikkelingen en samen leren om het allerbeste en mooiste werk te maken met Silverlight en de Expression tools. Sluit je aan bij de Silverlight en Expression insiders, zodat we elkaar verder kunnen helpen. Ik kan zelf niet events organiseren. Ik ben een designer, geen manager. Maar als designer kan ik op zo’n event natuurlijk wel bijdragen. Door te presenteren, door te reageren en te discussiëren. Dat is ook precies wat ik van plan ben te gaan doen op komende Sixin events. Voorlopig werkt de Sixin samen met de andere .NET user groups in Nederland om tot inspirerende bijeenkomsten te komen.

Andere initatieven die klaarliggen om verder te ontwikkelen zijn, even afgezien van Sixin website zelf, een Gallery waarin we ons werk kunnen delen en er op kunnen reageren. Zie dit als een goede mogelijkheid om feedback op je werk te krijgen van vakbroeders, van wie je de mening kunt respecteren omdat ze weten waarover ze spreken. Zo kunnen we elkaars werk zien en de laatste ontwikkelingen van andere ontwerpers volgen. Een van mijn dromen is om, naast de twee boeken die ik nu over XAML en Silverlight heb geschreven, een puur visueel boek te maken, waarin de pracht en praal van ontwerpen in Silverlight en met Expression Studio verzameld zijn. Het zoeken is naar een uitgever, die inziet dat je mensen voornamelijk kan inspireren door de mooiste resultaten die je met Silverlight kan bereiken visueel en toegankelijk te maken. De Gallery op de website van Sixin zou een mooie basis zijn om ontwerpen uit te selecteren voor zo’n koffietafelboek. Verder zou ik graag een eigen magazine uitbrengen, waarin ontwerpers hun werk kunnen toelichten, maar ook educatieve artikelen in staan. Deze initiatieven zijn we nu nog niet aan ontwikkelen, maar geven wel aan waar de Silverlight en Expression Insiders naar toe kan groeien. Als je zo’n groep van vakbroeders in Silverlight en Expression Studio wel ziet zitten, laat dan je e-mail adres achter op de Sixin site, zodat we je op de hoogte kunnen houden van de ontwikkelingen.

Njoy!

WPF 3D: Presentation at the Software Development Conference (3): Deepest

De derde Demo heet Deepest en gaat over interactieve schermen op driedimensionale oppervlakken. Ik spin en flip hier planes met een Registratieformulier erop. Verder schanier ik die planes opzij in twee richtingen en draai ik ze uit de hoek in beeld voor ik ze rechtzet. Ook hier is een Harmonica te zien, eigenlijk twee: een bovenin het scherm met portretjes en een rechtsonder in het scherm die afbeeldingen bevat. Die kunnen gecombineerd worden tot interessante 3D oplossingen voor master/details scenario’s. Verder toon ik hier ook kubussen met formulieren van buiten en van binnen en draai de camera om een kubus met formulieren erop.

Daarnaast zitten er nog wat verassingen in de demo’s. Linksonder in Deep klapt een Expander uit om buttons te tonen waarmee ik de Xbox doos omvorm tot boeken over WPF 3D: 3D Programming For Windows van Charles Petzold, WPF Unleashed van Adam Nathan en mijn eigen Handboek XAML, waar ook een hoofdstuk over 3D in staat.

Om te bewijzen dat andere modellen dat een rechthoekige doos ook kunnen, wilde ik een blikje frisdrank tonen. En welk blikje is beter geschikt dan die van de Macaw Liquid Energy, die ook tijdens de SDC wordt uitgereikt? Het was tamelijk eenvoudig om in de 3D modelleer applicatie ZAM3D de rechter contour van het blikje te tekenen en via de lathe functie (denk draaibank) er een cylinder van te maken. De afbeelding erop is van het oorspronkelijk ontwerp voor het etiket, al aangepast is aan de nieuwe huisstijl. Via de Viewbox en Viewport eigenschappen is die op de juiste plaats gezet en een animatie, die het blikje eindeloos ronddraait, maakt het helemaal af.

Dit alles levert materiaal op voor de mensen, die de sessie op de Software Development Conference bezoeken, met voorbeelden en code om zelf in hun interfaces met 3D aan de slag te gaan. Ze krijgen een CD mee met de presentatie en de mogelijkheid om vanuit de slides deze demo’s op te starten. Verder staat op de CD alle broncode die ik het verzameld en geschreven om deze demo’s te laten werken.

De demo en de source code zijn beschikbaar via mijn public map op mijn SkyDrive:

http://cid-8073406c0ec0e68a.skydrive.live.com/browse.aspx/Public

“Handboek XAML”, specifiek voor designers van applicaties en websites

Eerste boek dat in het Nederlands uitleg geeft over XAML

Macaw-medewerker Antoni Dol schrijft “Handboek XAML”, specifiek voor designers van applicaties en websites

Macaw-medewerker en Senior Designer Antoni Dol heeft een handboek geschreven over XAML. XAML staat voor eXtensible Application Markup Language en is de nieuwe taal voor het programmeren van gebruikersinterfaces voor Windows-applicaties, Silverlight-browserapplicaties en applicaties voor Windows Mobile en mobiele telefoons van Nokia. Wat HTML is voor websites, is XAML voor dit soort applicaties. Het eerste exemplaar van het boek is gisteren uitgereikt tijdens de Microsoft Mix Essentials aan Martin Tirion, User Experience Evangelist van Microsoft Nederland. Microsoft DevDays is het jaarlijkse evenement voor professionele softwareontwikkelaars en architecten in Nederland. Mix Essentials wordt tijdens de DevDays gehouden en is speciaal voor designers.

Het “Handboek XAML” is het eerste boek dat in het Nederlands uitleg geeft over hoe ontwerpers van gebruikersinterfaces XAML kunnen toepassen bij het vormgeven van schermen voor Windows Vista programma’s en Silverlight browserapplicaties. Sinds 2006 werkt Antoni met Windows Presentation Foundation (WPF) en XAML en sinds dit jaar is daar Silverlight bijgekomen. Informatie die hij voor de uitvoering van zijn WPF en XAML projecten nodig had, haalde hij uit boeken die door programmeurs waren geschreven, maar vanwege het jargon voor een designer moeilijk te begrijpen waren. Dit was voor Antoni de aanleiding om zijn ervaring en kennis te bundelen in een handboek dat zich specifiek richt op designers, in de taal die zij begrijpen en met onderwerpen en illustraties die hen aanspreken.

XAML is dé mark-uptaal voor applicaties op basis van Windows Presentation Foundation (WPF), onderdeel van het .NET 3.x-platform, waarmee interfaces voor Windows Vista en browserapplicaties in Silverlight geprogrammeerd worden. Beide zijn bedoeld om gebruikersinterfaces te maken die de User Experience veel beter ondersteunen dan Windows- en browserapplicaties tot nu toe hebben gedaan. Het Handboek XAML is een compleet en een helder naslagwerk van de uitgebreide mogelijkheden van XAML en WPF.

Handboek XAML is uit!

Vandaag heb uit uit handen van de uitgever van Van Duuren Media het eerste exemplaar van het Handboek XAML ontvangen. Het is een mooi, handzaam boek geworden, volledig in kleur en hoewel helemaal bekend, ook helemaal nieuw… Het boek is vandaag (en wordt ook morgen 23 mei) tijdens de pauzes tussen de sessies op de DevDays verloot op de stand van Macaw. 23 mei is ook een nieuwe signeersessie gepland, dus als je mijn krabbel in het boek wil, kom langs!

Hieronder een paar foto’s als bewijs 🙂

Handboek XAML in de stand van de TechBookShop

Poster met aankondiging signeersessie

Poster met Handboek XAML

Welkom!

Welkom bij ADdendum. Deze Blog is bedoeld als aanvullen en toevoeging op het Handboek XAML en andere leuke onderwerpen met betrekking tot UI design, XAML, WPF, Silverlight en mobiele toepassingen.
Njoy!