Você está na página 1de 4

05/04/2015 TutorialWPF|UXProcessodeDesign

Incio User Experience UX Processo de Design Share ... Alimente Sobre Christian Moser

Casa
Inspector WPF

Comeando
Introduo
ao WPF
Ferramentas
de
desenvolvimento ExperinciadoUsurioProcessodeDesign
Livros
Criar um
aplicativo
Experinciadousuriotornaseumfatorchavedesucesso
WPF
simples No passado, ns nos concentramos principalmente na construo de produtos que cumpriram os requisitos funcionais do
Instruo usurio. A experincia do usurio foi muitas vezes considerada tardia no processo de desenvolvimento. Mas hoje o cliente
Vdeos exige mais do que apenas um produto de trabalho. Proporcionar os recursos adequados ainda o prrequisito para um
Saiba WPF bom produto, mas para transformlo em algo extraordinrio que voc precisa para proporcionar uma boa experincia do
em duas usurio!
semanas Proporcionar uma experincia de usurio no uma coisa de fortuna. Precisa de ser aplainada, concebido e integrado no
desenvolvimento de um produto. Projetando uma rica experincia do usurio no apenas sobre fazer a sua interface com
Fundamentos o usurio por alguns grficos e gradientes um conceito muito mais amplo. Sua sobre a criao de uma conexo
O que h emocional entre o usurio e seu software. Ele faz o usurio se sentir bem e assim que ele gosta de continuar a usar o
de novo no software.
XAML no
.NET 4.0
NovasFerramentasparaDesigners
XAML
Propriedades Microsoft reconheceu, dar as equipes de desenvolvimento o poder de criar experincias de usurio que necessita de
de suporte da ferramenta muito mais grfica do VisualStudio pode fornecer hoje. Ento eles decidiram criar um novo conjunto
dependncia de ferramentas feito para designers.
Eventos
roteados
Lgicoe
rvore
Visual
Hardware e
Softwarerequirements
Soluo de
problemas
WPF

Experincia De
Usurio
UX
Processo de
Design Este conjunto de ferramentas chamado Microsoft Expression . composto por quatro produtos:

Expression Blend construdo para criar interfaces de usurio em WPF e Silverlight. Ele constri a ponte entre o
Patterns
designer e desenvolvedores. Ele pode abrir solues VisualStudio
Dependency
Expression Design uma verso leightweight do Adobe Illustrator para criar e editar grficos vetoriais.
Injection
Expression Media construdo para codificar, corte e enriquecer os arquivos de vdeo e otimizlos para streaming
Desfazer
Silverlight
Refazer
Expression Web Microsoft prxima gerao de HTML e editor Javascript. o substituto para Frontpage.
Model
View Juntos, eles so um poderoso pacote. A ilustrao a seguir mostra o fluxo de trabalho de integrar uma imagem do vetor
ViewModel que criado por um designer grfico em Adobe Illustrator em um projeto WPF que faz parte de uma soluo VisualStudio.
Pattern
DelegateCommand

Controls
Lista de
Controles
3partido
ItemsControl
LivePreview
ComboBox
Calendrio
Dicas de
ferramentas

http://www.wpftutorial.net/Workflow.html 1/4
05/04/2015 TutorialWPF|UXProcessodeDesign
Caixa de FluxodeTrabalhodeDesenvolvimentodeumProjetoWPF
texto
DataGrid O desenvolvimento de uma aplicao WPF com uma rica experincia de usurio exige muito mais habilidades do que
ContextMenu apenas um analista de requisitos que define uma lista de casos de uso e desenvolvedor que implementa o software. Voc
tem que descobrir o que o usurio realmente precisa. Isto pode ser feito atravs de uma abordagem centrada no utilizador.
Expander
Menus
PasswordBox
Dilogos
Botao de
radio
Slider
Aparecer

ListBox
Disposio
de
Itens
Aplique
uma
DataTemplate
Strech
um
item
Selecionados
Histrico
item
ListView 1.elicitarosrequisitos
TextBlock
Como em qualquer tipo de software projeta a sua importante conhecer e concentrar o alvo de seu desenvolvimento. Voc
deve conversar com as partes interessadas e os usurios para descobrir as reais necessidades. Estas necessidades devem ser
Janela
refinado para recursos e expressa em casos de uso abstratas ou cenrios de usurios ilustrativa. Priorizar as tarefas de
Remover
risco e importncia e trabalhar de forma iterativa. Este trabalho feito por o papel do engenheiro de requisitos.
o
cone 2.CriarevalidarUIPrototype

Controles A criao de um prottipo de interface do usurio um passo importante para compartilhar idias entre usurios e
personalizados engenheiros para criar um entendimento comum sobre o design de interao. Esta tarefa normalmente feito por um
UserControls designer de interao. til apenas esboar a interface do usurio de forma spera para evitar que as primeiras discusses
vs. sobre detalhes do projeto. Existem vrias tcnicas e ferramentas para fazer isso. Algumas delas so:
CustomControls
Prottipo de papel
Como criar
Use papel e lpis para desenhar esboos de sua interface de usurio. No h ferramentas e infraestrutura
um
necessria. Todo mundo pode simplesmente rabiscar vrios daqueles idias no papel.
controle
Wireframes
personalizado
Wireframes so frequentemente usados
para esboar o layout de uma pgina. chamado de wireframes, porque
voc s desenhar os contornos de controles e imagens. Isso pode ser feito com ferramentas como o PowerPoint ou
Traado
Visio
Introduo
Expression Blend 3 Esboo Fluxo fluxo Sketch um novo recurso legal para criar prottipos interativos
ao layout
diretamente no WPF. Voc pode usar o "estilo wiggly" integrado para tornla esboado. O prottipo pode ser
WPF
executado em um jogador autnomo que tem um mecanismo de feedback integrado.
StackPanel
Interativo Prototype A abordagem mais caro e real criar um reutilizveis prottipo interativo que funciona como
Painel Doca
a aplicao real, mas com dados fictcios.
Painel
envoltrio altamente recomendvel para testar seu prottipo de interface do usurio em usurios reais. Isso ajuda voc a descobrir e
Painel de problemas de projeto endereo no incio do processo de desenvolvimento. As seguintes tcnicas so muito populares para
grade avaliar prottipos de interface do usurio:
Painel
Walktrough
Canvas
A walktrough feito geralmente no incio de um projeto com wireframes ou prottipos de papel. O usurio recebe
ViewBox
uma tarefa para resolver e ele controlls o prottipo tocando no papel. O lder do teste do que apresenta um novo
Crie um
papel que mostra o estado depois da interao.
painel de
Usability Lab
layout
Para fazer um laboratrio de usabilidade, voc precisa de um computador com um software de captura de tela e
personalizado
uma cmera. O proband recebe uma tarefa para fazer eo requisitos e interao engenheiro vlo fazendo isso. Eles
no devem falar com ele para descobrir onde ele fica preso e por qu.
Entrada
Teclado
3.ImplementarNegciosLogicandRawInterfacedeUsurio
Mouse
Toque 4.IntegreDesignGrfico
Mutli
RoutedCommands5.Testedesoftware
em um
ContextMenu
Roles
Ligao de
Compilando uma interface de usurio moderna, com uma rica experincia de usurio requer habilidades adicionais de sua
dados
equipe de desenvolvimento. Essas habilidades so descritos como funes que podem ser distribudos entre os povos em
Associao
sua equipe de desenvolvimento.
de Dados
Desenvolvedor
Data De O desenvolvedor responsvel por implementar a funcionalidade da aplicao. Ele cria o modelo de dados,
Validade implementa a lgica de negcios e fios tudo at uma viso simples.

http://www.wpftutorial.net/Workflow.html 2/4
05/04/2015 TutorialWPF|UXProcessodeDesign
Defina Designer Grfico
um O designer grfica responsvel por criar um conceito grfico e construo de elementos grficos como cones,
ValidationError logos, modelos 3D ou esquemas de cores. Se o designer grfico est familiarizado com as ferramentas Microsoft
pelo Expression ele cria diretamente estilos e modelos de controle.
Cdigo Designer de Interao
Maneira O designer de interao responsvel pelo contedo e o fluxo de uma interface de usurio. Ele cria wireframes ou
elegante desenhos de interface do usurio para compartilhar suas idias com a equipe ou cliente. Ele deve validar o seu
para trabalho, fazendo Walktroughs ou storyboards.
INotifyPropertyChanged Integrador
Conversores O integrador o artista entre o designer eo mundo do desenvolvedor. Ele leva os activos do designer grfico e
de Valor integralos na interface do usurio cru do desenvolvedor. Esse papel precisa de um raro conjunto de habilidades e
Depurar por isso muitas vezes difcil de encontrar a pessoa certa para ele.
problemas
de
DataBinding
MaisInfos
Como
A nova iterao Livro Microsoft sobre o Designer / colaborao desenvolvedor
vincular
EnumValues AdsbyGoogle DatagridWPF WPFXaml SilverLightWPF WPFDataGrid
Visualizao
de dados, ltima modificao: 20100105 12:01:58
classificao Copyright (c) por Christian Moser, 2011.
e filtragem
Data
Popular Comentrios sobre este artigo
Encadernao
Expresses Mostrar todos os comentrios

Comentou sobre 6.May 2011


Styling
Designtime Para prototipagem UI voc pode usar Balsamiq http://balsamiq.com/products/mockups
Vencedor
maquete ferramenta muito agradvel.
vs. Runtime
Temas
Comentou sobre 7.May 2011
Styles Obrigado, sua til e simples!
Triggers Mehdi Rizvandi

Estilo
Comentou sobre 26.May 2011
herana
Substituir wah wah g
Papu
o
estilo Comentou sobre 6.June 2011
padro
H, obviamente, so tantos os tolos ao redor. Este um tutorial dumbFin.
Modelos de Paruppu
controle
Modelos de Comentou sobre 15.June 2011

dados Apenas timo, obrigado


Thorsten

Localizao
Comentou sobre 24.June 2011
Avaliar um
Para informaes de livre seguro de vida a toda a hora em qualquer lugar do mundo
mecanismo Sneha
chamar
de
Sneha + 919096273779
localizao
Localizao
usando um Comentou sobre 27.June 2011

MarkupExtension Very Nice Tutoriais para Iniciantes WPF !!!


Darshan S ....

Interao
Comentou sobre 27.June 2011
Comportamentos
Very Nice Tutoriais para Iniciantes WPF !!!
Drag & Darshan S ....
Drop
Comentou sobre 30.June 2011
Recursos YEPPPEEEEEEEEEEEEEEEEEEEEEEE
Leia RX100

recursos
Comentou sobre 30.June 2011
WPF de
WinForms muito bom
castro
MergedDictionaries
Carregando Comentou sobre 7.July 2011
BAML
Que Otimo !!!!
Definir new_programmer
DynamicResource
de Cdigo Comentou sobre 9.July 2011

Muito obrigado ... explicao Perfeito .. mantmnos a ler mais de ur artigos


Siva
Grficos 2D
DrawRoundedRectangle
Desenhe Comentou sobre 12.July 2011

excactly em
esta muito usar cheio para mim .........
dispositivos
Nawab Anas ...
fsicos
pixels

http://www.wpftutorial.net/Workflow.html 3/4
05/04/2015 TutorialWPF|UXProcessodeDesign
Geometria Comentou sobre 13.July 2011
Transformer Boa Informaes ......
Deepu
Imagens
Como obter
Comentou sobre 18.July 2011
um bitmap
de um no gud
gaio
Visual
Comentou sobre 24.July 2011
Grficos 3D
de graa ??
Introduo Joe
ao WPF 3D
Comentou sobre 27.July 2011

Animao que incrivel


nency
Ajustar a
taxa de
Comentou sobre 27.July 2011
quadros
que incrivel
Depurao nency
Animations
Comentou sobre 18.August 2011
Multimdia bom para begginners .....
muthahhar
Speech
Synthesizer
Comentou sobre 24.August 2011

Documentos de boa
drishya
FlowDocuments
Imagens Comentou sobre 30.August 2011
em linha
Boa explicao.
em um Pranjal R Nigam
FlowDocument
Comentou sobre 14.September 2011

Windows 7 Bom artigo


Shubhangi
Dialog Task
Jumplists
Comentou sobre 16.September 2011
Glass
perfeita explicao !!!
Windows DK

Interoperabilidade Comentou sobre 16.September 2011


Resoluo perfeita explicao !!!
DK
de tela de
consulta
Comentou sobre 19.September 2011
App
recursos e Bom ma
Shahul
WinForms
Integrao
Nome

Atuao EMail opcional


Top 11 WPF Comente
Dicas de
desempenho
Publicarcomentrio
Expression
Blend
Prototipao
com
SketchFlow
Suplementos
Como
importar
arquivos
Photoshop

Ferramentas
XAML
Conversores
Designers
Grficos
Utilities
Editores
XAML
UI Automation

http://www.wpftutorial.net/Workflow.html 4/4