Recriando designs de aplicativos do iOS no Windows 8

Applies to Windows only

Veja a seguir designs comuns de aplicativos do iOS e como eles podem ser reformulados no Windows 8.

Se você pretende trazer um aplicativo existente do iOS ou de outra plataforma para o Windows 8, há uma pergunta fundamental que deve fazer: é melhor portar ou reprogramar o aplicativo?

Se o seu aplicativo tiver sido criado com uma solução middleware, processo ao qual o Windows 8 também dá suporte, talvez a decisão seja óbvia. Porém, se o aplicativo tiver sido programado do zero em Objective-C, você terá um pouco mais de trabalho.

O seu aplicativo usa bibliotecas programadas em C ou C++? Então há uma boa chance de que você poderá reutilizar o código sem muitas alterações. Por exemplo, se você usa uma biblioteca C++ para executar parte do processamento de imagens ou cálculos complexos, pode programar seu aplicativo do Windows completamente em C++ e usar o mesmo código-fonte ou então usar a biblioteca C++ na forma de um componente do Tempo de Execução do Windows (semelhante a uma DLL, se você souber programação Win32 do Windows). Você pode então programar o restante do aplicativo em C# ou em JavaScript e chamar os métodos em seu componente C++.

O método de conversão de outros aplicativos para execução no Windows 8 depende de fatores como o design básico ou o uso de controles nativos desses aplicativos. Vamos analisar alguns tipos básicos de aplicativos e discutir como poderíamos reformulá-los como aplicativos da Windows Store.

Um jogo ou outro aplicativo programado em OpenGL

Pressupondo que o seu aplicativo não use uma solução middleware, como o Unity, mas, em vez disso, seja constituído de Objective-C e OpenGL (com ou sem o uso de GLKit), você precisará recriá-lo usando DirectX com C++.

Um jogo arcade em DirectX

O Centro de Desenvolvimento do Windows contém vários tópicos para ajudá-lo na transição de OpenGL para DirectX, incluindo:

Um jogo 2D ou aplicativo sem controles nativos

Um aplicativo que renderiza seus próprios botões e outros controles, como um aplicativo educativo, um leitor de revista ou um jogo mais causal, é provavelmente o tipo mais fácil de aplicativo a ser convertido para o Windows 8.

Um jogo 2D arcade/casual/de quebra-cabeça

Se os elementos gráficos do seu aplicativo usarem animação 2D simples, a versão do Windows 8 poderá ser uma boa candidata à adaptação com um projeto JavaScript/HTML5, pois o controle HTML5 Canvas dá suporte à renderização de 2D semelhante a um controle UIImage. Você também pode optar por usar C# e XAML, usando objetos XAML como Image, Rectangle e Ellipse: veja Desenvolver o Reversi, um jogo da Windows Store em C# e XAML.

Se houver muitas animações avançadas no seu aplicativo, uma solução middleware e/ou o DirectX poderão ser necessários para obter as taxas de quadro de animação de que você precisa.

Independentemente da abordagem usada, lembre-se de que, se você não aproveitar os controles e recursos exclusivos do Windows 8, seu aplicativo poderá parecer estranho e genérico para os usuários.

Um aplicativo com alguns controles nativos

Um aplicativo que projeta um livro de mesa provavelmente será semelhante nas duas plataformas. A versão do iOS geralmente exibira a imagem em um controle UIImageView e depois usaria controles UIToolbar ou UINavigationView para navegação, provavelmente personalizados com o protocolo UIAppearance.

Um aplicativo de livro de mesa do iOS

O aplicativo da Windows Store poderia exibir as imagens em um FlipView ou estruturar a navegação usando um controle de barra de aplicativos. A barra de aplicativos oferece um local para colocar os botões de navegação e outras funcionalidades, mas também pode ficar oculta até que o usuário deslize o dedo para cima na tela (ou clique com o botão direito do mouse ou pressione a tecla Windows e X). Isso dá ao seu conteúdo um pouco mais de espaço na tela.

AppBar no Windows 8

Os botões são outro controle do Windows 8 e aparecem quando são invocados com um gesto de passar o dedo a partir da direita (ou quando o mouse é movido para o canto inferior direito ou o usuário pressiona a tecla Windows e C). Os botões são um menu de todo o sistema que o seu aplicativo pode utilizar para acessar os recursos Pesquisa, Configurações, Compartilhamento e Impressão.

Botões do Windows 8

Veja a seguir alguns tópicos relacionados que abordam os controles do Windows 8:

Um aplicativo com uma lista de itens

Neste design, uma lista de itens é exibida (geralmente usando um UITableView em um aplicativo do iOS) normalmente em um controlador de tela dividida. O painel maior é usado para exibir os detalhes de um item específico.

Aplicativo do iOS que usa TableView

Você pode criar uma exibição semelhante a um UITableView em um aplicativo da Windows Store usando o controle ListView, com um estilo que pode ser ajustado basicamente da mesma maneira que células no UITableView - veja Modos de exibição de tabela (iOS para Windows).

No entanto, o Windows 8 também oferece o controle GridView, que é útil principalmente para exibir listas de dados e visualizações em um formato de rolagem lateral. O GridView aproveita a tela mais ampla dos dispositivos Windows e, além disso, o uso do controle Semantic Zoom permite que o usuário tenha rapidamente uma visão "aérea" da coleção e vá diretamente a uma seleção específica. O controle Hub apresentado no Windows 8.1 é ideal para aplicativos com várias páginas de informações (veja Código de exemplo JavaScript do controle Hub ou Código de exemplo C# do controle Hub).

Um aplicativo do Windows 8 que usa um modo de exibição de grade

Alguns tópicos que descrevem os vários controles do Windows 8 usados:

Um aplicativo que usa um modelo de navegação de detalhamento

Muitos aplicativos do iOS usam vários controles UITableView para navegar até partes cada vez mais detalhadas de um aplicativo, usando um UINavigationController para gerenciar o empilhamento das exibições e voltar à exibição principal quando necessário.

Um aplicativo do iOS que usa UITableView

Você pode criar um sistema de navegação hierárquica semelhante usando menus de cabeçalho, conforme descrito em Design de navegação para aplicativos da Windows Store. Ao iniciar a navegação entre páginas, você precisa começar a pensar em como preservar o estado das páginas entre exibições e entre inicializações de aplicativos. Veja Parte 2: gerenciar o ciclo de vida e o estado do aplicativo (aplicativos da Windows Store em C#/VB e XAML) para saber onde encontrar informações sobre isso.

Um aplicativo do Windows 8 que usa um modo de exibição de grade

Tópicos relacionados úteis:

Um aplicativo com exibições ou painéis de informações separados

Talvez o seu aplicativo tenha várias páginas separadas de informações, mas, diferentemente dos painéis que compõem, por exemplo, um aplicativo de previsão do tempo, os painéis dele não têm muito em comum, de modo que não seria adequado passar o dedo lateralmente em uma exibição panorâmica. Um aplicativo do iOS pode usar uma barra de ferramentas ou um controle segmentado na parte inferior da tela para o usuário tocar e mudar de exibição.

Aplicativo do iOS com um controle segmentado

Um aplicativo da Windows Store pode usar uma barra de aplicativos para mostrar links para cada exibição e, se necessário, fixar a barra de aplicativos para que ela fique sempre visível. Entretanto, uma abordagem mais apropriada pode ser o uso de uma Barra de Navegação na parte superior da tela, que aparece com um simples gesto de passar o dedo da parte superior à parte inferior da tela (ou um gesto de clicar com o botão direito do mouse ou pressionar as teclas Windows + Z).

Um aplicativo do Windows 8 com uma única exibição

Um aplicativo do Windows 8 com uma barra de navegação

Outro recurso da interface do usuário do Windows 8 é o Zoom Semântico, em que o gesto de pinçagem reduz a exibição, tornando visíveis todos os itens de uma lista e oferecendo uma visão geral. Em seguida, o usuário pode selecionar a exibição desejada com um toque ou clique.

Um aplicativo com um histórico de rolagem vertical

Muitos aplicativos do iOS apresentam uma exibição que rola verticalmente, mostrando na parte superior informações mais atuais do que as da parte inferior. Por exemplo, um aplicativo de rede social ou um cliente de mensagens.

Aplicativo do iOS com rolagem

Os aplicativos da Windows Store também dão suporte a exibições com rolagem (veja Diretrizes do movimento panorâmico (aplicativos da Windows Store)), de modo que você pode recriar esse estilo no seu aplicativo sem dificuldade.

Dito isso, há muitas boas razões para experimentar outras maneiras de apresentar essas informações: talvez usando um GridView de rolagem horizontal, que usa o Zoom Semântico para permitir que o usuário vá diretamente para seções específicas (por exemplo, fotos, notícias, pessoas e mensagens).

Um aplicativo do Windows 8 com modo de exibição de grade

Conclusão

Geralmente, é consideravelmente fácil recriar seu aplicativo para o Windows 8, principalmente se os controles usados por ele forem simplesmente versões personalizadas dos controles nativos. Para controles mais avançados criados especificamente para o seu aplicativo (discos de rotação, itens representativos e botões), você pode alterar a aparência dos controles XAML no Blend para Microsoft Visual Studio 2013 ou criar seus próprios com imagens em um controle HTML5 Canvas. Para controles muito complexos, talvez seja necessário recorrer às opções de renderização de alta velocidade oferecidas pelo DirectX ou por uma solução middleware.

Da mesma forma, os modelos de navegação comuns do iOS podem ser reproduzidos no Windows 8, porém, os novos controles de barra de aplicativos, barra de navegação, GridView e Zoom Semântico podem oferecer maneiras novas e interessantes de reformular o seu aplicativo e proporcionar uma experiência otimizada aos usuários.

Outros tópicos úteis

 

 

Mostrar:
© 2014 Microsoft