Diário de desenvolvimento Fluffmark: tornando a anotação de imagens uma alegria

De onde veio a ideia

Fluffmark tem uma origem engraçada. Eu pretendia construir um componente de anotação compartilhado para todos os meus aplicativos de imagem. Enquanto trabalhava nisso, fiquei inesperadamente apaixonado pelo produto em si. Me apaixonei por usá-lo para postar fotos com palavras e comecei a querer expressar mais.

O que o aplicativo faz

Deixe-me ir direto aos recursos.

1. Primeiro, é um aplicativo de anotação de imagens que lida com imagens estáticas, GIFs e Live Photos. Ele exporta o mesmo tipo de formato que você importou. Anotações em GIFs e Live Photos são adicionadas como uma sobreposição, preservando a animação subjacente.

2. As ferramentas de anotação incluem:

   1. Adicionando texto

   2. Desenhar linhas, com pontas de seta configuráveis em cada extremidade

   3. Desenho à mão livre

   4. Desfoque

   5. Pixelização

   6. Retângulos

   7. Círculos

   8. Inserindo imagens

   9. Cortar ou estender a tela

   10. Cantos arredondados

Vou me concentrar nos recursos nos quais mais pensei.

Adicionando texto

Meus amigos Xiaoyun e Xiaoyu frequentemente postavam fotos com palavras escritas diretamente nelas em WeChat Moments. Isso me fez pensar: quão bom seria apenas escrever as palavras, sem ajustar o estilo e a posição? Então criei um layout de texto automático, com alguns detalhes úteis:

1. Evite o assunto automaticamente. Encontre um local para o texto que não interfira no assunto da imagem.

2. Corresponda cores automaticamente. Use as cores principais da imagem para sugerir diversas paletas de texto. Normalmente, o padrão já parece bom.

   

Além dos controles de texto comuns, adicionei vários recursos mais incomuns:

1. Envolva o assunto. Organize as palavras ao longo do contorno do assunto principal, geralmente uma pessoa, para criar um efeito de envolvimento.

   

2. Pincel de texto. Pense nisso como uma quebra manual de assunto, com mais liberdade para desenhar palavras em formas inesperadas.

   

3. Texto adaptável em dois tons. Cada caractere muda para preto ou branco de acordo com a imagem abaixo dele, criando um contraste mais forte.

   

4. Bolhas de bate-papo do WeChat. Esta adição recente recria a aparência familiar e atraente de uma conversa do WeChat. Escolha imagens de avatar para você e para a outra pessoa na primeira vez e reutilize-as na próxima vez.

   

Desenho à mão livre

1. Pinceladas de caligrafia. Eu trouxe uma demonstração anterior de pincel de caligrafia para este projeto. Fluffmark pode produzir traços de tinta muito realistas; até mesmo um simples círculo desenhado à mão parece muito mais expressivo do que uma marca de pincel digital comum.

   

2. Reproduza os traços. Ao editar uma Live Photo, ative a reprodução dos traços. Na Live Photo exportada, seu desenho aparece em movimento, como se você o estivesse escrevendo novamente.

   

Imagens

Ao inserir uma imagem, você também pode extrair o assunto. Isso abre todos os tipos de possibilidades de colagem lúdica.

Outros detalhes

Passei muito tempo aprimorando este aplicativo e o uso todos os dias. Alguns dos detalhes da interação incluem:

1. A interface fica oculta enquanto você usa ferramentas na imagem, para que você possa ver a imagem inteira.

2. Desenhar e ampliar a imagem não interferem um no outro.

3. A barra de ferramentas passou por muitas revisões para fazer um espaço pequeno funcionar bem.

4. O aplicativo está disponível para iOS, iPadOS e macOS. No Mac, fiz melhorias específicas da plataforma, como arrastar imagens, usar caixas de diálogo para abrir e salvar baseadas no Finder e oferecer suporte a atalhos de teclado.

Preço

Isto também é o que descrevo como meu primeiro produto totalmente gratuito, com apenas suporte financeiro opcional. Se você gostar, poderá contribuir com 18 RMB uma vez ou 18 RMB por ano para me ajudar a criar produtos melhores e mais acessíveis. Optar por não contribuir não afeta nenhuma funcionalidade. Eu, brincando, chamo isso de início da minha mendicância pela internet.

Tal como acontece com meus outros aplicativos, não há muita ajuda. Experimente as ferramentas e explore. Desfazer e refazer são bem desenvolvidos, então você não precisa se preocupar em perder seu trabalho enquanto experimenta. Espero que você goste de usá-lo e se sinta mais inspirado para se expressar.