Descrever telas e fluxos

Nível: A2

Objetivo

Nomear elementos de interface (login screen, form, button, dropdown, checkbox, modal) e descrever um user flow passo a passo, usando as preposições from...to, into e through para indicar origem, destino e travessia entre telas.

Explicação

Em produtos digitais, screens (telas) contêm elementos de interface previsíveis. Saber nomeá-los em inglês é essencial para conversar com o time, abrir tickets e escrever critérios de aceitação.

Elementos de tela — vocabulário-chave

• Login screen: a tela inicial onde o usuário entra com usuário e senha.
• Sign-up screen / sign-up form: a tela de cadastro.
• Form: o conjunto de campos para enviar dados (cadastro, pagamento, feedback).
• Text field / input field: cada caixa de texto individual dentro de um form.
• Button: o botão que dispara uma ação (Submit, Continue, Cancel).
• Dropdown: a lista suspensa (`select an option from the dropdown`).
• Checkbox: a caixinha de marcar (`check the box to agree`).
• Modal / pop-up: a janela que aparece sobre a tela e exige ação.
• Settings / dashboard / notification: telas e áreas comuns do produto.

Interações de usuário

• Click / tap um button.
• Enter um valor em um text field (`enter your email`).
• Select uma opção (`select your country from the dropdown`).
• Check / uncheck a checkbox.
• Submit / send o form.
• Log in / log out / sign in / sign up: atenção à grafia — log in e sign in são verbos separados; login e sign-in funcionam como substantivo ou adjetivo (`the login screen`, `the sign-up form`).

User flow — o caminho do usuário

Um *user flow* é a sequência de telas pelas quais o usuário passa para concluir uma tarefa. Para descrevê-lo, use três preposições essenciais:

• from...to: indica origem → destino.

`The user moves from the home screen to the settings screen.` `We redirect the user from the login page to the dashboard.`

• into: indica entrada em uma tela ou estado.

`Tap into the search bar to type a query.` `The error leads the user into a retry loop.`

• through: indica travessia por várias etapas ou telas.

`The user goes through three steps to complete checkout.` `Walk through the flow before you release the feature.`

Instruções de navegação

Para guiar alguém dentro do produto, use imperativo curto e direto:

• `Open the app and tap Log in.`
• `Enter your email in the first field.`
• `Select a plan from the dropdown.`
• `Check the box to receive notifications.`
• `Click Submit to send the form.`
• `Close the modal to return to the home screen.`

Combine esses passos com `then` ou `after that` para criar um pequeno fluxo:

`From the home screen, tap Settings. Then scroll down into the privacy section. Finally, go through the toggles and disable the notifications you don't need.`

Exemplos

Erros comuns

• Escrever `log-in` ou `login` como verbo: o verbo é separado, `log in` / `sign in`; a forma junto é substantivo ou adjetivo.
• Dizer `make click` em vez de `click`: use `click the button` (verbo + objeto), sem `make`.
• Esquecer o artigo: prefira `click the Submit button` em vez de `click Submit button`.
• Trocar `from the dropdown` por `on the dropdown`: o item é selecionado de dentro da lista, então use `from`.
• Confundir `into` e `in`: `tap into the field` significa entrar no campo para digitar; `the text is in the field` descreve localização estática.
• Usar `by` em vez de `through` para listar etapas: `go through the steps` indica travessia; `go by the steps` não é natural aqui.
• Dizer `open the form` quando o usuário apenas vê a tela: o form já está aberto; o usuário `fills out` ou `submits` o form.

Prática guiada

Reescreva cada instrução de forma mais natural em inglês:

• "O usuário vai da tela inicial para a tela de pagamento." → `The user moves from the home screen to the checkout screen.`
• "Toque na barra de busca para digitar." → `Tap into the search bar to type.`
• "O cadastro passa por três etapas." → `The sign-up flow goes through three steps.`

Agora descreva um fluxo curto: abrir o app, fazer login, abrir configurações, desativar notificações. Use pelo menos `from...to`, `into` e `through` na sua resposta.

Resumo

Nomeie telas e elementos (login screen, form, button, dropdown, checkbox, modal) e use `from...to` para origem/destino, `into` para entrar em uma tela ou área, e `through` para descrever a travessia por várias etapas. Para instruções, prefira imperativos curtos: `click`, `enter`, `select`, `check`, `submit`.

História: Descrever telas e fluxos

Nível: A2

História em inglês

A new feature at the coffee app

Last week, the product team released a new feature for the coffee app. The feature lets users order ahead and pick up their drink at the counter. Maya, a QA engineer, opened the app on her phone to test the new user flow. First, the login screen appeared with two text fields and a Sign in button. She entered her email and password, and then clicked Submit.

Walking through the order flow

After login, the user lands on the home screen. From the home screen, the user taps into the Order tab to start a new order. The order form has a dropdown for the drink size and a dropdown for the milk type. Below the form, there is a checkbox that says, "Make it a large size." Maya checked the box to test the large-size option. Then she scrolled down into the payment section and entered her card details. She tapped Submit, and a modal popped up to confirm the order.

A small bug and a quick fix

Maya noticed a small bug: the modal did not close after she tapped Confirm. She closed the modal manually and went back to the order form. Then she went through the flow one more time to confirm the bug. On the second try, the modal closed correctly and the order went through. Maya sent feedback to the team through the in-app form. In her message, she described the user flow step by step, from login to checkout. The team thanked her and promised to fix the bug before the next release.

Tradução linha por linha

Notas de vocabulário

• user flow = sequência de telas que o usuário percorre para concluir uma tarefa
• Sign in button = rótulo comum para o botão de entrar; verbos em inglês se separam (sign in)
• From the home screen = from...to liga a tela de origem à próxima etapa
• taps into the Order tab = into indica entrada em uma área da tela para interagir
• dropdown for the drink size = lista suspensa usada para escolher entre opções
• checked the box = verbo padrão para marcar uma checkbox
• a modal popped up = modal é a janela sobreposta; pop up é o verbo que descreve o aparecimento
• went through the flow = through descreve a travessia por todas as etapas do fluxo
• release = publicação de uma versão do produto

Perguntas de compreensão

1. What new feature did the product team release?
2. What did Maya see on the login screen?
3. Where does the user tap to start a new order?
4. What did the order form contain?
5. What bug did Maya find?
6. How did Maya send her feedback to the team?

Prática com a história

1. Reescreva como instrução: The user has to open the app and tap Log in.
2. Complete with from...to, into ou through: Maya moved ___ the home screen ___ the Order tab.
3. Traduza: "Marque a caixa para pedir um tamanho grande."
4. Descreva em uma frase o que o usuário faz depois de tocar em Submit no formulário de pedido.