Mergulhe nos detalhes do iOS 11: A Apple ainda está orientada por detalhes?

Dias ew F atrás, a Apple teve sua queda evento especial no Steve Jobs teatro localizado dentro Apple Park, revelando a todos tela do iPhone X, e mais tarde empurrando iOS 11 GM para testadores beta, que está saindo oficialmente na próxima semana. Eu atualizei meu telefone assim que recebi o impulso do iOS 11 GM.

Desde a WWDC em junho, fui um testador beta para iOS 11, que passou por um verão intensivo de atualizações incrementais. Com o meu 4,7 polegadas iPhone 7 e iOS 11 GM em mãos, ainda existem muitas sensações inacabadas de software Beta. Como designer, não posso deixar de escrever sobre meus sentimentos.

Estou escrevendo isso para ajudar as pessoas a se dar conta de muitos detalhes que exigem polidores adicionais, que esperançosamente incluam pessoas na Apple e podem avançar com mudanças para melhorar esses detalhes.

O sentimento inacabado no iOS 11 vem principalmente da IU e da animação. Os elementos de IU no iOS são bastante inconsistentes, misturando vários elementos de UI, que podem parecer bastante semelhantes, mas apresentam um sentimento desconectado para o UX. A inconsistência desses elementos provoca maior parte do elemento UI atualizado no iOS 11, como o Título Grande e a Nova Barra de Pesquisa. Na minha opinião, esses elementos recém-introduzidos, que podem não ser familiares e novos até mesmo para os engenheiros da Apple, causaram muitas experiências de UI inconsistentes no iOS 11.

Mail.app

Primeiro, vejamos o Mail.app no ??iOS 11. Como outros aplicativos nativos, o Mail também apresenta uma nova Barra de Navegação com Título Grande. No entanto, Título grande no Mail, tem margem extra esquerda em comparação com o exemplo do guia de design. Aqui vamos usar o Search Bar como objeto de referência. No exemplo do guia de design, o Título grande e a Barra de Pesquisa compartilham a mesma distância para a borda, mas em Mail.app, o Título Grande se move claramente um pouco à direita, em comparação com a Barra de Pesquisa.

Watch.app

Em Watch.app, o Search Bar não segue o estilo sugerido, destacando-se com o fundo não configurado. Em aplicativos nativos adotando estilos iOS 11, a Barra de Pesquisa deve combinar a barra de navegação naturalmente, ao contrário de Watch.app.

No vídeo de instruções do Building Apps para iPhone X publicado pela Apple, eles mencionaram exatamente o mesmo caso:

O WWDC.app na esquerda é contra-exemplo que não combina estilos, e Contacts.app na direita é um estilo de combinação de melhores práticas. O comentarista no video afirma:

Isso passa para a segunda questão que eu encontrei … se eu trazer o campo de busca, bem, isso não parece bem. Vamos comparar isso com a lista de aplicativos Contatos. Algumas coisas parecem erradas aqui. A cor do fundo da barra de pesquisa não está bem. E o dimensionamento está um pouco fora.

Portanto, o iOS 11 está sugerindo um fundo correspondente entre Barra de Pesquisa e Barra de Navegação. No entanto, o Watch.app não o segue como um aplicativo nativo. Além disso, uma vez clicado, o Search Bar em Watch.app quase está beijando a barra Status, o que mostra mais polonês para ser feito pelos engenheiros da Apple.

Files.app

Barra de pesquisa em Files.app também tem alguns problemas. Parece que os engenheiros do Files.app usaram uma barra de pesquisa não padrão. Da imagem abaixo, em comparação com a barra de pesquisa padrão em Settings.app, Files.app possui uma barra de pesquisa ligeiramente menor e uma cor de fonte mais clara.

Além da diferença de cor / tamanho, a animação depois de clicar em Barra de pesquisa também é diferente. A animação da barra de pesquisa padrão em Settings.app:

Em seguida, barra de pesquisa em Files.app:

Comparativamente, Search Bar em Files.app tem animação mais rápida, mas menos lógica de animação natural e um pouco de sensação inacabada.

App Store.app

A App Store do iOS 11 passou por um redesenho e introduziu estilo similar, como a Apple Music. No entanto, na guia Hoje da App Store, em comparação com a Apple Music's For You, as fontes da data são diferentes, pois a App Store usa uma audaz enquanto a Apple Music usa uma luz. E na Apple Music, "quarta-feira" é seguido por uma vírgula, mas na App Store falta a vírgula.

Também comparação entre esses dois aplicativos. Na página de Pesquisa, o item de Tendência de toque na App Store não ativará um efeito de deslocamento como feedback para toque, enquanto uma ação similar na página de pesquisa da Apple Music irá ativar um efeito de deslocamento, mudando a cor de fundo / primeiro plano do item. Na minha opinião, a Apple Music faz isso melhor e os aplicativos nativos devem ser consistentes após a decisão de rever o retorno, independentemente de ter ou não.

Além disso, ainda há algumas questões diversas entre os detalhes. Na App Store, abra qualquer aplicativo com imagem de banner, deslize ligeiramente da borda esquerda para a direita (mas não deslize completamente que descartará a página do aplicativo). A seção de bandeira renderá estranhamente depois que a página voltará para trás:

Você pode verificar esse bug com o vídeo abaixo.

Além disso, há um problema de desempenho. Na guia Atualizações, puxe para baixo para atualizar os itens e há uma queda de quadro óbvio se o título grande for puxado demais para baixo. Você pode sentir você mesmo facilmente.

Health.app

Na página Health.app, entre hoje e Página de dados de saúde, os mesmos dados e os mesmos estilos, mas de largura diferente. Este é um problema antigo do iOS 10 e ainda não está corrigido.

Widget de hoje

No iOS 11, existem duas maneiras de abrir o Widget de Hoje, seja ao deslizar da esquerda para a direita na tela inicial, ou na tela de bloqueio, mas a Barra de Pesquisa em páginas invocadas de maneira diferente terá comportamento diferente. Quando invocado a partir da tela inicial, puxar para baixo a página do Widget não mostrará a tela de Pesquisa, e clicar em Barra de Pesquisa falta animação de mostrar e descartar o efeito de vidro fosco e a animação da barra de pesquisa alargada (embora haja animação de encurtá-la) depois de cancelar. A experiência geral é bastante estranha.

Quando invocado a partir da tela de bloqueio, há animações em todos os lugares e puxando para baixo a página de Widget mostrará corretamente a tela de Pesquisa, experiência muito suave e natural.

Isso está causando um sentimento bastante desconectado do Today Widget em dois cenários. Obviamente, o invocado a partir da tela inicial é bastante inacabado em comparação com o invocado a partir da tela de bloqueio. O que é estranho é que o Widget de hoje invocado a partir da tela inicial no iOS 10 tem todas essas animações e pode mostrar a tela de pesquisa puxando para baixo. Não há ideia de por que ele vai para trás no iOS 11.

No entanto, o Widget Hoje invocado a partir da tela bloqueada no iOS 11 também está indo um pouco para trás em comparação com o iOS 10. Na página Widget Hoje, quando a página do usuário puxar para cima, a Barra de Busca irá aumentar o widget com vidro fosco, evitando que o widget empilhe na Barra de Pesquisa . No entanto, clicar na barra de pesquisa fará com que o vidro fosco desapareça imediatamente, lentamente, renderizando um vidro fosco de tela cheia. Cancelar a barra de pesquisa fará com que o vidro fosco em tela cheia desapareça lentamente e, de imediato, renderiza a pequena seção de vidro fosco sem animação, um pouco natural.

Preste atenção na barra de pesquisa na parte superior da tela

Se o vídeo for muito rápido, você pode verificá-lo por quadro. O que podemos ver é que o vidro fosco em tela cheia não está relacionado ao vidro fosco da seção superior em termos de renderização suave, levando a uma sensação desconectada.

Além das animações em falta, o iOS 11 também traz animação redundante. No iOS 11, cada vez que passa do Widget de Hoje de volta para a tela bloqueada, a seção do Jogador redimensionará uma e outra vez, o que é bastante desnecessário.

Na página de sugestões de pesquisa Siri invocadas depois de clicar em Barra de pesquisa, existem dois problemas. Primeiro, ao tocar sugestões, o feedback do mouse está usando uma largura menor do que a largura da tela, fazendo com que o feedback do mouse se torne um retângulo estranho. O feedback apropriado do pairo já está presente na Apple Music, onde o efeito hover usa a largura total da tela.

Em segundo lugar, e muito estranho, se você olhar cuidadosamente para a fonte Siri Search Suggestions, verá que eles estão irregulares (especialmente o script latino) perto de bordas, não são suaves, mesmo se comparando ao texto de entrada na mesma tela.

Photos.app

A margem inadequada, muito ou muito pouco, aparece em muitos lugares do iOS 11, causando maiores sentimentos de trabalho inacabado / não polido.

Na guia Compartilhada do Photos.app, a margem (como apontado abaixo pela seta) é muito estreita e inconsistente em comparação com outros aplicativos nativos com páginas semelhantes.

Settings.app

Na seção Settings.app ? Apple ID, o alinhamento da lista de dispositivos está completamente desligado da seção ID. Isso estava correto no iOS 10 e quebrado no iOS 11.

Music.app

Na seção Connect da Apple Music, algumas postagens terão uma margem muito pequena entre a imagem e o texto. Esta não deve ser uma decisão de design, uma vez que a margem no cliente do iTunes no MacOS da área de trabalho é apropriada. Embora o Connect seja de fato um recurso raramente usado, a Apple não deveria estar cometendo um erro tão básico no design da UI.

Também na Apple Music, inserindo a lista do Álbum através da Biblioteca e, em seguida, clicando na lista das letras iniciais para ir rapidamente a essa seção. Você verá que a seção de letra inicial em cima é cortar capas de álbuns.

Anunciado como um recurso no iOS 10 na WWDC, a tela do player da Apple Music também se torna estranha no iOS 11. A reabertura da tela do player fará desaparecer a sombra sob a capa do álbum reproduzida e a tampa do álbum diminuída durante a pausa também aumentará se o reprodutor for reaberto tela.

Os vídeos estão listados abaixo:

Pausar música, zooms da capa do álbum, fechar e reabrir a tela do player, zooms da capa do álbum de volta:

Reprodução de música, sombra sob a capa do álbum, feche e reabra a tela do jogador, desapareceu:

No iOS 10 com AirPods, quando o dispositivo AirPlay estiver conectado, a tela do player mostrará o nome do dispositivo perto do ícone AirPlay. Isso foi no iOS 11.

Algumas pessoas podem pensar que esta é uma escolha de design, mas é realmente um bug. No vídeo abaixo, quando o dispositivo AirPlay está conectado, o nome do dispositivo é exibido corretamente. No entanto, a reabertura da tela do player fará desaparecer. Se for uma escolha de design, o nome do dispositivo não deve ter mostrado inicialmente.

E no Podcasts.app que usa o mesmo estilo de design que a Apple Music, o nome do dispositivo AirPlay está sempre lá.

Outro erro na Apple Music. Como sabemos, existem duas maneiras de deslocar para cima no iOS, clicando em Barra de status ou clicando em ícone na Barra de tabulação. Na Apple Music, acertar a barra de status retornará corretamente à barra de navegação de Título Grande, ao pressionar o ícone Tabera retornará uma pequena barra de navegação de fontes, conforme mostrado abaixo.

Uma vez que no Podcasts.app e App Store.app, clicar em ambos irá retornar barra de navegação de Título Grande, esse comportamento na Apple Music é definitivamente um bug.

Centro de Controle

No Centro de Controle, a seção do dispositivo AirPlay também tem problemas. Muitas vezes, durante o uso de AirPods, o Control Center mostrará o iPhone como o dispositivo e, quando AirPods for mostrado como dispositivo, pausar a música fará com que o dispositivo se torne iPhone (embora o AirPods ainda esteja sendo reproduzido).

Preste atenção ao nome do dispositivo acima do título da música

Há também uma animação inapropriada no Control Center, a animação 3D Touch no Screen Mirroring:

Weather.app

Weather.app no ??iOS 11 também foi atualizado usando fonte maior e menos margem. No entanto, notei que o texto temperado no iOS 11 não está alinhado no centro, enquanto ele estava no iOS 10.

Esta pode ser uma decisão de design do iOS 11. No entanto, durante o uso real, devido ao não alinhamento, para alguns dígitos, é muito óbvio para o usuário que o texto está mais próximo da borda esquerda, o que não mostra nenhum pro em comparação com o iOS 10.

Problema falso falso para PingFang no Safari

O último e mais grave problema, na minha opinião, é fonte. Os problemas acima podem não afetar o uso normal, mas o problema abaixo afetará todos nós.

Esse é o problema de fonte negrito falso para PingFang (tipo de letra chinês padrão do iOS) no iOS 11 Safari. Descobriu este problema quando eu estava testando sites pessoais no iOS 11. Abaixo de todas as comparações são tomadas entre iOS 11 e iOS 10.

Como mostrado acima, o PingFang realmente está sendo interpretado como falso em negrito. Faux bold (realce) é basicamente não usando o peso da fonte fornecido pela própria fonte, mas para adicionar o peso da fonte em algum peso da fonte de base forçosamente. Faux bold é gerado por algoritmo e muitas vezes falta qualidade, causando problemas de pesos de traçado e rastreamento de letras. Na captura de tela, você pode ver que o falso estilo PingFang no iOS 11 tem espaçamento maior entre os textos.

Após alguns testes, descobri que isso só aconteceria quando a fonte-família CSS inclui "-apple-system", ou seja, fonte-família usando fonte San Francisco fornecida pelo sistema. Uma vez que o removemos, o sistema irá respeitar o peso da fonte fornecido pela própria fonte e falso negrito desapareceu.

Este problema não é apenas no Safari, mas impacta todos os aplicativos que utilizam o mecanismo webkit do iOS para renderizar a página da web, como o navegador interno do WeChat e Douban.app. Como você pode ver, Douban.app foi dominado pelo falso PingFang negrito, que parece bastante ruim.

Ao escolher aleatoriamente uma publicação de revisão de filme, você notará que o título está em falso em negrito. Através da comparação, você também notará que o espaçamento de fontes em falso negrito é problemático. Na verdade, isso não é apenas uma fonte em negrito, mas também sobre o peso regular ou qualquer tipo de letra, de modo que você esteja vendo "faux regular" e assim por diante. Faux regular não é facilmente identificado a partir do peso do traçado, mas a partir da comparação abaixo você notará que o espaçamento entre fontes é diferente no iOS 11 para que cada linha de textos tenha palavras diferentes, o que prova a presença de "falso regular".

E verifique mais fotos de falso em negrito em WeChat.app.

Este problema de fonte falso do Safari apareceu no iOS 11 Beta 1 e enviei um relatório de erro através do aplicativo Feedback mais cedo em agosto (o número do caso é # 3436665 ). No entanto, ainda é um problema a partir de hoje, e provavelmente para iOS 11 ou mais. Como um entusiasta da tipografia, estou bastante decepcionado com isso.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *