Eduardo Rangel Brandão, Ph.D. - Designer Focused on UX, People Management and Creation of Multiple Platform Products - Current/Past Experience & Portfolio

EDUARDO RANGEL BRANDÃO, PH.D.DESIGNER FOCUSED ON UX, PEOPLE MANAGEMENT AND CREATION OF MULTIPLE PLATFORM PRODUCTS

EDUCATION, EXPERIENCE & PORTFOLIO

[email protected] | eduardobrandao.com/english-version/

November 2016

• Introduction: why does UX matter? • Introducing Eduardo • Education • Experience • Main clients • Main responsibilities as a UX manager • Main responsibilities as a UX designer • Main skills as a UX designer • Other skills • Work process • Portfolio • Plans for the future • Contact information

_Contents

As a designer, I don`t just solve problems,

I also discover them!

I believe that UX doesn’t just serve users, it also serves businesses and their stakeholders.

I work with people and processes to reach organization objectives

in the most efficient manner possible

For each design that I creates, I hope the user ends up with a satisfaction smile

after he/she experience it.

“

• UX can be the difference between success and failure of a project.

• Creating a good UX at the beginning of development can save time and money.

• Fixing a problem with UX after a project is complete can cost 100 times more than during initial design.

• By taking the time to understand your audience and crafting a personalized digital journey around their needs, you can reduce development waste and long-term costs.

• A good digital experience will drive more conversions.

• UX will also save your business money through reduced expenses from customer service, training and other business resources.

• UX will improve customer satisfaction and brand perception, increasing your brand’s overall lifetime customer value.

* References: Why user experience Is the best ROI strategy <http://www.business.com/web-design/why-user-experience-is-the-best-roi-strategy/> * References: Cost & return on investment <http://www.usability.gov/basics/usasaves/>

_Introduction: why does UX matter?

Designer focused on UX, people management and creation of multiple platform products (designed to run on computers, smartphones, tablets, smart-TVs, video-game consoles, set-top boxes, etc.). Worked on different projects for several types of businesses (e.g. industrial gases companies, media companies, pay-TV companies, petroleum industry companies, telecommunications companies, vertical information portals, etc.).

• UX manager at Globosat, the largest pay-TV content provider in Latin America.

• Professor and researcher at the catholic university of Rio de Janeiro, teaching classes related to product design, IxD/UX/UI design, information architecture, human-factors, research methodology and usability evaluation techniques.

• Editorial board member of the Ergodesign & Human-Computer Interaction Journal.

• Member of scientific advisory committee in international conferences related to human-factors, usability and human-computer interaction.

_Introducing Eduardo

• Ph.D. in human-computer interaction.

• M.Sc. in human-computer interaction.

• Expert in human-factors and usability.

• Bachelor of visual design.

• Bachelor of product design.

_Education

_Experience

_2008 - 2011 Professor at graduate program in marketing and digital design

(School of advertising, marketing and business administration)

_2007 - 2008 Professor at graduate program

in webdesign: interactive interfaces (Institution of higher education)

_2006 - 2008 Senior information architect

(Vertical information portals and the internet branch of Globo`s group,

the largest media group of Latin America)

_2006 - 2009 Professor at graduate program

in design for information systems (National service of commercial learning,

a professional education institution)

_2005 Researcher

(Government institution to support research)

_Since 2005 Professor at graduate program

in usability evaluation methodologies (Catholic university of Rio de Janeiro)

_Since 2004 Researcher

(Human-factors and usability laboratory)

_1999 - 2000 User interface designer

(The first search engine of Brazil - it was sold to StarMedia

and then to Yahoo!)

_1999 User interface design intern (Internet service provider)

_1995 - 1997 Design intern

(University support unit which manages the campus area computing resources

for public use)

_Since 2008 UX manager (since 2015),

new media coordinator/head of UX (11-15) and senior information architect (08-10)

(The largest pay-TV content provider in Latin America)

_2000 - 2003 User interface designer

(One of the most important brazilian advertising agencies

specialized in internet solutions)

(Pay-TV channels)

_Main clients

(Health care provider) (Bank)

(Construction/engineering company)(Telecommunications company)

_Main clients

(Government institution) (Museum) (Telecommunications company) (Petroleum industry company) (Construction/engineering company)

(Shopping mall) (Multimedia archive and cultural institution) (Broadcast-TV company) (Industrial gases company) (Information technology and documentation company)

• Work in harmony with the business strategy and the users needs.

• Bring the perspective of the user (their needs and problems) into the decisions the business makes everyday and advise about what works for the customers and what won’t.

• Define how the user experience of the company`s products should be, set the values for a good experience, set the values for the UX`s team and define which paths should be followed today and in the future.

• Contribute for the creation of the whole business vision, acting to define strategic goals, priorities, work processes, technology, systems, requirements, performance metrics, etc.

• Provide any assistance to UX`s team, creating the right work conditions for the employees, so they could do their tasks the best way possible.

• Discover and select talented designers, develop their skills and group them into high performance UX teams.

• Act as a facilitator for other company`s departments, aiming to solve problems, conciliate different points of view and promote conditions to deliver the best user experience.

_Main responsibilities as a UX manager

If you want to read a full list of my main responsibilities as a UX manager, please visit http://eduardobrandao.com/english-version/main-responsibilities-as-a-ux-manager-and-as-a-ux-designer/

• Create prototypes of digital interfaces to make tangible the proposals design solutions, so the team could understand and test it.

• Get constantly feedback from digital interfaces users, per qualitative (card-sorting, controlled experiments, cooperative evaluation, focus-groups, interviews, usability tests, etc.) and quantitative (A/B tests and surveys) research.

• Evaluate digital interfaces using usability guidelines and best practices for interface design.

• Indicate which sections of digital interfaces should be improve and establish a roadmap to implement these improvements.

• Create personas and users scenarios to customize digital interfaces according each user profile.

_Main responsibilities as a UX designer

If you want to read a full list of my main responsibilities as a UX designer, please visit http://eduardobrandao.com/english-version/main-responsibilities-as-a-ux-manager-and-as-a-ux-designer/

_Main skills as a UX designer

_Other skills

MANAGEMENT QUALITATIVE RESEARCH METHODS

QUANTITATIVE RESEARCH METHODS

SOFTWARES/ TECHNIQUES/

TOOLS

• Design management • Department management • Team management • Team leadership • Product management • Project management • Budget management • Service design • Business design

• Card sorting • Controlled experiment • Cooperative evaluation • Field observations • Focus group • Heuristic evaluation • Interview • Task analysis • Usability test

• A/B test • Questionnaire/survey

• Analytics tools • Axure • Crazy-egg • Excel • HTML • Illustrator • Invision • Keynote • Optimizely • Photoshop • Power point • Principle • Search engine optimization • techniques • Sketch app • Survey monkey • Word • Word press

I work guided by a process created by me, which was inspired in some design companies like Ideo and Cooper.

_Work process

WORK PROCESS

Some examples of my work: product thinking.

_Portfolio

gastronomia

saúde e

beleza

bem- estar

pro- gra- mas

pro- gra- ma- ção

informações / fatos

ferramentas / aplicativos

site gnt

Nota:

As informações/fatos relacionados aos temas, aos programas e à programação são inputs para a oferta de conteúdos e serviços do site. As ferramentas/aplicativos se integram aos eixos de navegação, na tentativa de captar novos usuários, manter a audiência e criar uma experiência lúdica.

PRINCIPAIS EIXOS DE NAVEGAÇÃO

INFORMAÇÃO

APLICATIVOS

REDAÇÃO

COMUNIDADE

AGREMIAÇÕES

ÍDOLOS EVENTOS

CAMPEONATOS

MODALIDADES CONTEÚDO

aplicativos (orkut /

facebook)

blog

texto

programas

site gnt

badges celular podcasts rss widget

ferramentas

distribuição

tipos de conteúdo

eixos de navegação

comentários rating share

vídeo foto

programação gastronomia moda e beleza

botão 1 (120 x 90)

full-banner (468 x 60)

rectangle (300 x 250) shopping links

patrocinados formatos

comerciais

bem-estar

Some examples of my work: interaction design.

_Portfolio

Revisa o produto

em produção

CA

NA

L C

OO

RD

ENA

DO

R

DE

PRO

JETO

A

RQ

UIT

ETU

RA

D

E IN

FOR

MA

ÇÃ

O

DES

IGN

SI

STEM

AS

Solicita a avaliação do produto

Seleciona os responsáveis e determina os prazos

Avalia o produto

Avalia o produto

Avalia o produto

Aprova o produto

Aprova o produto

Aprova o produto

Gera relatório com

recomen- dações

Gera relatório com

recomen- dações

Gera relatório com

recomen- dações

Consolida o relatório

com recomen- dações

Solicita as alterações

para o seu fornecedor

Envia mensagem

de aprovação da área

Envia mensagem


Envia mensagem


Consolida as mensagens

de aprovação

Fecha o pedido

de avaliação do produto

Solicita a subida

do produto para

produção

SIM

SIM

SIM

NÃO

NÃO

NÃO

Encerra a solicitação

Seleciona os responsáveis e determina os prazos

Sobe o produto

para produção

Revisa o produto

em produção

Confirma a subida

do produto para produção

Sucesso? NÃO

SIM

Revisa o produto

em produção

Produto OK?

Produto OK?

NÃO

Produto OK?

NÃO

NÃO

SIM

SIM

SIM

Fornecedor faz as

alterações?

NÃO

SIM

1

2

3

3

3 4A

4A

4A

4B

4B

4B

5A 5B

6A 6B 7

8

9 10

11

11

12

13

Conteúdo automático Conteúdo editorial Conteúdo estático Conteúdo fixo LEGENDA:

Programa - modelo A Programa - modelo B Programa - modelo C

Conteúdo automático + editorial

STV

STV

HOME

HOME

HOME

HOME

HOME

HOME

STV STV

STV

STV STV

HOME

HOME

HOME

Mini-guia de episódios

Mini-guia de episódios Sinopse do programa Sinopse do

programa

Mini-grade de programação

Mini-home

Box comunidades

Rádio Multishow

Loja Multishow

Repete em todas as páginas

Repete em todas as páginas

1.1. Programa (A)

1.1.4.1. Matéria

1.1.1.1. Episódio

1.1.7.1. Biografia

1.1.5. Fotos

1.1.5.1. Fotos

1.1.2.1. Vídeos (A)

1.1.3. Envie seu vídeo

1.1.4. Matérias

1.1.1. Episódios

1.1.8. Ficha-técnica

1.1.6. Sobre o programa

1.1.7. Apresentadores

2.0. Programação

6.0. Blogs

4.0. Matérias

5.0. Fotos

7.0. RSS

8.0. Promoção

9.0. Fale conosco

0.0. Página inicial

1.2. Programa (B)

1.3. Programa (C)

1.1.2.2. Vídeos (B)

Conteúdo automático

Conteúdo editorial

Conteúdo automático + editorial

LEGENDA:

Conteúdo fixo

Conteúdo estático

3.0. Vídeos

10.0. Busca

NOTA IMPORTANTE: Os gráficos aqui representados não fazem qualquer referência a interface ou layout do site.

DESCRIÇÃO FUNCIONAL DE TELAS SporTV | Nova Home

NOVA HOME DO SPORTV

4. PROGRAMAÇÃO DO SPORTV:

A área de navegação pelos programas divide-se em:

(a) Cards com destaques da programação.

(b) Flash com o destaques para os programas principais.

(c) Lista com todos os programas do SporTV.

(d) Lista com todas as modalidades do SporTV.

Cada uma destas sub-áreas deve ser tratada de forma a destacar as diferenças da informação apresentada, como:

a - Cards com destaque para a programação:

Os cards com destaque para a programação do SporTV fazem referência aos programas que serão exibidos no dia (ex: Arena SporTV, Expresso da Bola, Tá na Área, etc.), ou à eventos específicos (ex: Liga Mundial de Vôlei, Master Series, Taça Libertadores, etc.).

§  Contém 6 cards, no máximo (2 colunas com 3 cards em cada uma).

§  SEMPRE DEVE SER UTILIZADO UM NÚMERO PAR DE CARDS (2 cards, 4 cards ou 6 cards).

§  NUNCA DEVE SER UTILIZADO UM NÚMERO ÍMPAR DE CARDS (1 card, 3 cards ou 5 cards).

a1 - Cada card segue o padrão do site SporTV e contém: §  Imagem contextualizada com o assunto do card (imagem com funcionalidade - link). §  Título do card (título com funcionalidade - link). §  Texto com 3 linhas, no máximo (texto com funcionalidade - link).

Título Texto do destaque texto texto texto.




IMAGEM

IMAGEM IMAGEM

NÃO PERCA NO SPORTV:

Arena SporTV »

Bem, Amigos! »

Caminhos da Aventura Oi »

Dossiê SporTV »

Expresso da Bola »

Fora do Eixo »

Jogos para Sempre »

Linha de Chegada »

Missão Pan 2007 »

Momento Olímpico »

Mundo Fitness »

Navegando »

Veja todos os programas:



IMAGEM IMAGEM

Redação SporTV »

SporTV Tá na Área »

SporTV News »

Troca de Passes »

Zona de Impacto »

Para mais informações, passe o mouse sobre a marca de cada programa

A

C

E B

D


IMAGEM

a1

Todas as modalidades

IMAGEM

a

Todos os programas

b

c

d

7.5. Sub-header (continuação): O desenho ao lado mostra o comportamento do filtro da grade de programação com o radio-button �filtrar grade� selecionado – a partir dessa seleção, os demais filtros da página são ativados.

7.5

exibir todos os programas Filtrar grade

Escolha uma modalidade, programa ou time ao vivo inédito





Modalidade Programa Time



Atletismo Basquete Esportes aquáticos Esporte motor Futebol Ginástica Lutas Tênis Vôlei

1

2

3

4

1) O radio-button �filtrar grade� ativa os demais filtros da página (drop-down de modalidade, programa ou time e os check-boxes �ao vivo� e �inédito�)

2) No drop-down, o usuário deve escolher uma modalidade, ou um programa, ou um time...

3) ... após escolher uma opção no drop-down (modalidade, programa ou time), o drop-down complementar é ativado com as opções correspondentes: •  Modalidade = lista de modalidades * •  Programa = lista de programas * •  Time = lista de times * * São listadas somente as modalidades, programas ou times que possuem página no site do SporTV

4) O usuário escolhe uma das opções listadas no drop-down correspondente

Selecione ▼ Selecione ▼

Selecione ▼ Selecione ▼

Modalidade ▼ Selecione ▼

Modalidade ▼ Selecione ▼

7.7. Calendário (continuação): •  Além de selecionar cada data, o usuário também pode navegar através dos botões �anterior� (seta para a esquerda - ◄) e �próximo� (seta para a direita - ►). Quando não há mais navegação para um dia anterior ou próximo, o botão correspondente fica desativado.

7.7

DOM 19

JUL

SEG 20

JUL

TER 21

JUL

QUA 22

JUL

QUI 23

JUL

SEX 24

JUL

SAB 25

JUL

DOM 26

JUL

SEG 27

JUL

TER 28

JUL

QUA 29

JUL

QUI 30

JUL

SEX 31

JUL

SAB 01

AGO ◄ ►

hoje

Dias desativados (sem programação

disponível)

Botão �próximo� desativado (sem navegação para os próximos dias)

Dias ativados (com programação

disponível)

DOM 19

JUL

SEG 20

JUL

TER 21

JUL

QUA 22

JUL

QUI 23

JUL

SEX 24

JUL

SAB 25

JUL

DOM 26

JUL

SEG 27

JUL

TER 28

JUL

QUA 29

JUL

QUI 30

JUL

SEX 31

JUL

SAB 01

AGO ◄ ►

hoje

DOM 19

JUL

SEG 20

JUL

TER 21

JUL

QUA 22

JUL

QUI 23

JUL

SEX 24

JUL

SAB 25

JUL

DOM 26

JUL

SEG 27

JUL

TER 28

JUL

QUA 29

JUL

QUI 30

JUL

SEX 31

JUL

SAB 01

AGO ◄ ►

hoje

Dia selecionado pelo usuário (por default, o calendário é carregado com o dia corrente selecionado)

Some examples of my work: product thinking and interaction design.

_Portfolio

Some examples of my work: qualitative user research.

_Portfolio

Some examples of my work: qualitative user research.

_Portfolio

Some examples of my work: quantitative user research.

_Portfolio

Página Estilo

Dia 26/07 ao 04/08 Dia 18/08 ao 10/09

Maiores interesses Blogs de Estilo Principais programas de Estilo Looks No último mês, muitos cliques nas matérias sobre unhas.

Matéria – Gafes do Photoshop (home Globo.com)

A área mais clicada foi �continue por aqui�

As matérias do �veja também� foram bastante clicadas. Possível causa: estava do lado da foto, que era o final da matéria.

Quase ninguém usou a navegação da barra superior e a busca.

Some examples of my work: quantitative user research.

_Portfolio

A B

Some examples of my work: interaction design, visual design and prototyping.

_Portfolio


_Portfolio


_Portfolio


_Portfolio

• Act as an advisor in any kind of business, (1) showing the benefits to enlarge the UX role inside organizations (UX shouldn`t be treated as only a department, but it should be embraced as an entire company philosophy) and (2) providing the application of the design methodology into business management (helping companies to solve day-by-day problems, to improve work flows or processes and to make more room for creative processes, reaching innovation).

• Create an organization or institute which provides some kind of mentoring program from senior UX professionals to young UX designers or even non-UX professionals (people who wants to become a UX designer soon).

• Act in a global role (beyond the UX related field), having a holistic approach to help entire organizations to solve any issue (businesses can be designed from within to operate more efficiently and at higher levels of effectiveness).

_Plans for the future

[email protected]

http://eduardobrandao.com/english-version/

https://br.linkedin.com/in/eduardobrandao

https://www.facebook.com/eduardobrandao.com.br

55 21 99914-4851

_Contact information

Eduardo Rangel Brandão, Ph.D. [email protected] | eduardobrandao.com/english-version/

November 2016

THAT`S ALL FOLKS! :-)