O que há de novo: App Builder com recursos de IA mais inteligentes, ApexCharts, aprimoramentos de grade dinâmica e muito mais
É hora de soltar! Esta atualização App Builder traz recursos baseados em IA, novas ferramentas de visualização e manuseio de dados mais suave. O ApexCharts permite criar gráficos interativos diretamente na plataforma, enquanto o Pivot Grid gera automaticamente visualizações dinâmicas a partir de seus dados. Veja tudo isso em ação.
Zdravko Kolev
7min de leitura
Nosso lançamento de agosto de App Builder traz recursos poderosos de IA, componentes de visualização, manuseio de dados mais fácil e interações aprimoradas do usuário para seu fluxo de trabalho de design para código. Com o ApexCharts agora disponível na caixa de ferramentas do componente, você pode transformar dados brutos em gráficos dinâmicos e interativos sem sair da plataforma. A Grade Dinâmica leva a eficiência um passo adiante, gerando automaticamente dimensões e valores a partir de seus campos de dados, oferecendo uma visualização dinâmica pronta para uso em segundos. Para experiências de interface do usuário mais suaves, adicionamos um recurso Item de Lista Selecionado que aplica estilo e armazena valores escolhidos, além de novos modelos de Grade Vazia e Indicador de Carregamento para fornecer comentários significativos ao trabalhar com grades de dados.
Antes de mergulhar nessas novas funcionalidades, se esta é a primeira vez que você aprende sobre App Builder, deixe-me compartilhar rapidamente por que você deve considerá-lo uma ferramenta fundamental no processo de desenvolvimento de aplicativos para sua organização:
- Um construtor de aplicativos visuais – a plataforma unificada para executivos de nível C, arquitetos corporativos, líderes de equipe de desenvolvimento, designers, desenvolvedores e partes interessadas.
- Ferramenta de arrastar e soltar WYSIWYG baseada em nuvem que ajuda as empresas a projetar e criar aplicativos de negócios completos 80% mais rápido do que nunca.
- Uma ferramenta low-code gera código pronto para produção para Angular, React, Web Components e Blazor e converte Figma designs em código.
Desta vez, começarei com o que há de novo do ponto de vista da IA em App Builder.
Aumente a produtividade com recursos de IA mais inteligentes
Esta versão traz vários aprimoramentos que tornam a geração de aplicativos mais rápida, precisa e fácil de interagir. De estruturas de saída mais limpas a novas maneiras de gerar visualizações e temas, os recursos de IA agora se integram mais perfeitamente ao seu fluxo de trabalho.
Saída de aplicativo melhor estruturada
Os aplicativos gerados por IA agora vêm com layout, organização de componentes e estrutura de conteúdo aprimorados. Isso significa que seus aplicativos gerados exigem menos limpeza manual, permitindo que você se concentre em refinar o design e a lógica em vez de corrigir inconsistências.
Atalhos de teclado e caixas de diálogo de confirmação
A produtividade e a segurança aumentam com os atalhos de teclado para o painel de bate-papo de IA e a área de design:
- Ctrl/Cmd + Shift + C– Iniciar um novo bate-papo na visualização atual
- Ctrl/Cmd + Alt + C– Iniciar um novo bate-papo em uma nova visualização
- F2– Renomear item de histórico selecionado
- Ctrl/Cmd + Shift + A– Abra o painel GenAI de qualquer lugar na área de design
Além disso, ações destrutivas, como excluir uma etapa de bate-papo ou uma sessão inteira, agora acionam caixas de diálogo de confirmação, evitando a perda acidental de dados e alinhando o comportamento da IA com o restante da plataforma.
Gerar vistas a partir de imagens
Agora você pode fazer upload de uma ou mais imagens e permitir que a IA gere visualizações de aplicativos correspondentes automaticamente. Esse recurso simplifica os fluxos de trabalho de design, transformando ativos visuais em layouts de aplicativos funcionais em segundos.
Gerenciamento de temas com tecnologia de IA
Criar e atualizar temas agora é mais fácil com a ajuda da IA. App Builder pode gerar, modificar e excluir temas com base em sua entrada, ajudando você a manter a marca e o estilo consistentes em seus aplicativos.
Prompt:"mude as cores desta visualização para serem baseadas no outono"
Geração de fonte de dados mais inteligente
A IA agora produz fontes de dados mais precisas para componentes como grades e gráficos de dados, reduzindo o tempo de configuração e tornando os aplicativos gerados imediatamente funcionais.
Prompt:"Estou criando um painel interno para nossa empresa de logística rastrear remessas diárias, estoque de armazém e desempenho de entrega. Preciso de uma página que exiba KPIs, gráficos e tabelas de forma limpa e organizada, com filtros rápidos para intervalos de datas e status da remessa. Deve dar aos gerentes uma visão geral rápida do desempenho dos negócios."
Resultado:
Conversão de fala em texto para prompts de IA
A interação com a IA é ainda mais intuitiva com o suporte de fala para texto. Clique no botão do microfone na área de prompt, fale suas instruções e observe-as transcrever diretamente no campo de texto, perfeito para fluxo de trabalho com viva-voz ou captura rápida de ideias.
Veja como essas atualizações de IA tornam a criação de aplicativos mais rápida, inteligente e interativa em https://preview.appbuilder.dev/
Agora, de volta ao site da App Builder Production. O que há de novo nesta versão App Builder?
Visualize dados instantaneamente com o ApexCharts
App Builder agora inclui o ApexCharts na caixa de ferramentas do componente, oferecendo uma ampla variedade de tipos de gráficos interativos e ricos em dados na ponta dos dedos. Se você precisa exibir tendências de desempenho, detalhamentos de distribuição ou insights financeiros, o ApexCharts ajuda a transformar dados brutos em histórias visuais envolventes sem sair da superfície do design.
Com suporte para tipos de gráficos populares como Linha, Área, Barra, Coluna, Funil, Pizza, Rosquinha, Mapa de calor, Radar, Área Polar e opções avançadas como Candlestick, Box Plot, Range Charts, Scatter e Bubble, você pode cobrir quase todas as necessidades de visualização. Cada gráfico pode ser facilmente vinculado à sua fonte de dados e estilizado por meio do painel de propriedades do App Builder, com suporte para geração de código Angular e React pronto para uso.
Aqui está o ApexCharts em ação:
Gire de forma mais inteligente com visualizações geradas automaticamente
Configurar uma grade dinâmica agora é mais fácil do que nunca. Em vez de definir manualmente linhas, dimensões e valores, o App Builder gera automaticamente a visualização dinâmica com base na fonte de dados conectada. Basta soltar uma grade dinâmica em sua tela, vinculá-la aos seus dados e o layout é criado para você.
Isso significa:
- Configuração mais rápida
- Menos etapas de configuração
- E insights instantâneos sobre seus dados.
Você sempre pode refinar o layout mais tarde, mas a geração automática oferece um ponto de partida funcional que economiza tempo e aumenta a produtividade.
Confira como a configuração do pivô pode ser fácil:
Melhorar a experiência do usuário com a funcionalidade de item de lista selecionado
As listas em App Builder ficaram mais interativas. Com o suporte à seleção de itens de lista, agora você pode criar listas dinâmicas e com estado em que os itens selecionados são estilizados de forma consistente e seus valores armazenados para uso posterior. Esse recurso está disponível em listas vinculadas a dados. Se os itens da sua lista forem declarados manualmente, a opção "Ativar seleção de itens" não será aplicável. Isso abre cenários como:
- Destacando uma ação escolhida em um portfólio
- Marcando um cliente ativo em um diretório
- Ou criar fluxos de trabalho simples baseados em seleção
Além disso, o estado de seleção pode ser vinculado a variáveis, facilitando a reutilização e a aplicação em outras partes da lógica do aplicativo.
Veja como a seleção de listas funciona na prática:
Dê Vida às Suas Grades com Modelos Vazios e Carregados
As grades agora dão suporte a dois novos estados projetados para melhorar o feedback do usuário: o Modelo de Grade Vazia e o Modelo de Indicador de Carregamento. Esses estados permitem que você informe aos usuários quando não há dados para exibir ou quando os dados estão sendo buscados ativamente.
- Modelo de grade vazio: configure um espaço reservado com texto, ícones ou imagens quando nenhum registro for retornado, perfeito para consultas dinâmicas que podem retornar resultados zero.
- Modelo de indicador de carregamento: mostre uma interface do usuário de carregamento enquanto as chamadas de dados assíncronas estão em andamento, fornecendo comentários claros durante os tempos de espera.
Ambos os modelos são configuráveis no Painel de Propriedades do App Builder e suportados em Grade de Dados, Grade de Árvore, Grade Hierárquica e Ilhas de Linha. Embora o sinalizador deva ser definido manualmente após a isLoading geração do código, App Builder lida com a configuração de tempo de design para que você possa se concentrar na personalização da experiência do usuário.
Embrulhar...
O lançamento de maio reflete nosso compromisso contínuo em fornecer experiências de aplicativos escaláveis e modernas em App Builder. Esteja você projetando grades de dados complexas, aplicando regras de validação robustas ou simplificando fluxos de trabalho de DevOps, esta atualização oferece as ferramentas para avançar mais rapidamente e criar melhor.
Experimente os novos recursos hoje mesmo no appbuilder.dev
App Builder é um divisor de águas no processo de desenvolvimento de aplicativos. Com seu construtor visual baseado em nuvem, recursos de baixo código e novos recursos, é uma ferramenta obrigatória para qualquer organização. Experimente hoje! Se precisar de mais detalhes, recomendamos que você confira nosso:
Para experimentar tudo nas últimas atualizações do App Builder, visite o portal do cliente e obtenha a versão mais recente. Como de costume, estamos sempre ansiosos para receber seus comentários e ouvir o que você deseja adicionar ou recomendar. Então, por favor, envie-me um e-mail para zkolev@appbuilder.dev e deixe-me saber como podemos ajudá-lo a continuar agregando valor aos seus clientes com a Infragistics.
