Versão móvel do Habr. Versão 3.0

É possível que alguns de vocês estejam na versão móvel do Habr pela primeira vez, e alguém pelo contrário dirá que " esta é a terceira versão e não importa qual seja, mas em 2009 foi a mais ". Seja como for, desta vez eu queria fazer mais do que apenas anunciar a nova versão móvel. Foi bom retroceder o tempo e lembrar como era.Para essa retrospectiva, tivemos que recorrer ao arquivo da web. Graças a ele, as seguintes etapas podem ser distinguidas na vida do site:

22 de abril de 2009

Versão móvel de aniversário. Os shniks de identificação de postagens em Habré acabaram de chegar aos valores de seis dígitos e, no escritório da TM (então essa abreviação ainda era decifrada como "Mídia Temática") na pista de Krivokolenny, reinava a atmosfera de uma startup. Pouco antes dessa data, na cabeça de um dos desenvolvedores (Maxim rossomachin ), surge a idéia de criar uma versão experimental do Habr, que funcionaria melhor em dispositivos móveis.

Três pessoas (um programador, um tecnólogo da web e um designer de interface), duas semanas e o menor pós-anúncio apareceram no site: μHabr (citação literal do anúncio). Como se costuma dizer, nada mais - nem no anúncio, nem no recém-nascido nuHabr muHabr. Então esse nome não se enraizou, pois era difícil soletrar corretamente e todos pensavam que era um habratracker. Portanto, o nome “Microhabr” logo aderiu ao projeto.

Recursos da primeira versão móvel:

• Cada página pesava em média 5 kilobytes (excluindo conteúdo)
• A completa falta de publicidade e elementos desnecessários
• Cada página continha 40 links para publicações
• Bem exibido nas principais plataformas móveis

Nesta versão, as funções de autorização, votação e comentário não estavam disponíveis. Ou seja, poderia ser usado apenas para leitura, o que, de fato, era exigido dela naquele momento. O microhabr não era muito diferente do agregador de RSS, mas não exigia um aplicativo separado (exceto o navegador).

E ela ficou assim:

2010

Se Microhabr tivesse uma conta no Twitter, nos próximos anos ele seria como um twitter de pedra na floresta: diariamente "nada aconteceu hoje". Bem, talvez uma vez tenha penteado as fontes, tornando-as maiores e menos desbotadas:
Nesta forma (com pequenas alterações no layout), a versão para dispositivos móveis existia até 2014, pois o tráfego para dispositivos móveis naquela época era muito insignificante.

2013

Blogs que estavam no início da Habr, com o movimento fácil de uma mão, transformaram-se em centros elegantes. Tornou-se possível anexar cada publicação a vários hubs; portanto, a lista de hubs precisou ser movida para o cabeçalho. A versão móvel ainda é um leitor primitivo - o boom do tráfego móvel não ocorreu na época e todo o runet ignorou por unanimidade as soluções telefônicas.

2014. Versão 2.0 e o aplicativo móvel

De 2009 a 2014, a versão móvel do Habr permaneceu um leitor simples. No entanto, o crescimento do público móvel nos obrigou a atualizar o celular para a segunda versão, o que fizemos em 10 de junho de 2014. Não se trata tanto de um experimento de hobby de um dos funcionários, mas do trabalho deliberado de um grupo de pessoas em uma conspiração preliminar.

Se antes as telas diagonais (e suas resoluções) de vários PDAs não tinham permissão para brincar com indentação, em 2014, os smartphones capturavam o trono de ferro do mercado do império . Com a nova tipografia e margens mais arejadas, já era difícil exibir 40 publicações por página, então seu número foi reduzido para 10. O nome “Microhabr” não aparece em lugar nenhum - a “versão móvel” está em todo lugar.

Apesar do fato de ter sido um facelift principalmente (uma vez que o design anterior era obsoleto), o novo “móvel” adquiriu novos recursos: a autorização apareceu e, portanto, a capacidade de rastrear novos comentários nas publicações que o usuário já leu. Também houve a oportunidade de acessar o hub ou blog da empresa desejado.
No mesmo ano, foi lançado o aplicativo oficial Habr, lançado imediatamente em três plataformas (psicoanuli): iOS, Android e Windows Phone. A funcionalidade é semelhante: autorização, leitura de feeds, assinatura de hubs, voto-favoritos-comentários.



No aplicativo iOS, o avatar do usuário tem um pequeno ovo de Páscoa, que quase ninguém jamais encontrou.

2015. TM Feed

No final de 2014, outro evento importante na história da Habr ocorreu - os Geektimes se separaram . Alguns usuários foram muito sensíveis à divisão subseqüente de publicações em dois sites; portanto, para anestesiar isso, criamos o TM Feed - uma espécie de ponte entre os dois sites. A mesma versão móvel, mas com a capacidade de selecionar um ou ambos os sites como a origem. Ou todos os três (quando Megamind também apareceu em 2015).

2017

Alguns anos após a separação dos projetos, decidimos fazer um curso na grande Internet. Ir para lá em vários barcos seria muitas vezes mais difícil do que em um grande quebra-gelo, por isso foi decidido reunir todos os projetos divididos anteriormente. E a maneira mais fácil de começar a fazer isso era combinar projetos de conteúdo, pois eram o mais semelhante e o mais próximo possível da estrutura. Ao mesmo tempo, o TM Feed não era mais necessário e desapareceu do menu superior.

2018

Deixando Habr sozinho, decidimos atualizar sua versão móvel, que, de fato, permanece inalterada desde 2014. Era difícil fazer isso na versão antiga devido à grande quantidade de código legado há muito tempo, por isso foi decidido não redecorar, mas revisá-lo: redesenhar tudo do zero, reescrever todo o back-end e o front-end.

Se duas semanas se passaram da ideia ao lançamento em 2009, em 2018 não poderíamos ter tanta agilidade e tentamos fazer tudo "de maneira adulta": vários meses passaram os testes beta sozinhos, nos quais mais de 7000 pessoas participaram . E, como você sabe, não em vão - graças a ele, ou seja, você foi capaz de corrigir muitos bugs na versão móvel: de pequenos insetos imperceptíveis a besouros gigantes de Golias. E hoje, sob o toque dos sinos da primeira série, decidimos finalmente ficar verdes.

O lema que tentamos aderir: a versão móvel, uma versão simplificada. Portanto, algumas novas funções foram adicionadas ao requisito anterior (leitura conveniente das publicações) e lançaram as bases para novas escalas.

Do novo:

• Todas as entidades ficaram disponíveis: fluxos, hubs, listas de empresas e usuários
• Suporte para classificação de publicações: por assinatura, tudo em sequência e o melhor (por dia / semana / mês)
• Cada post tem um contador de novos comentários
• Houve uma busca por publicações e usuários
• Na parte inferior da publicação, apareceu um menu com a rolagem da página com métricas
• Votação mais conveniente para comentários

Sobre o design

“O trabalho realizado dificilmente pode ser chamado de redesenho. De fato, criamos um novo produto com apenas o endereço restante do antigo. O objetivo principal era criar um ambiente visual unificado, consistindo em um estilo gráfico do projeto e em cenários repetitivos de comportamento. ”

// Designer

Sobre a tecnologia

“A versão móvel antiga funcionava com o jQuery no front-end e o PHP com o mecanismo de modelo Blitz no back-end. O novo é construído com tecnologias mais modernas e bem estabelecidas. Ou seja, o Vue e toda a pilha perto dele (vuex, vue-router, vue-meta, vue-render-server), Express e Node.js: existe um frontend na forma de SPA, existe um backend (que processa esse SPA para solicitações de mecanismos de pesquisa e proxies na API) e um servidor de API separado ".

// Desenvolvedores

Os proprietários de Tesla admitem amargamente que a nova versão móvel é significativamente mais rápida que seus carros elétricos :)

E precisamos entender que, por enquanto, lançaremos a versão básica do Habr para celular, mas não a final: teremos carne nova com novos recursos um pouco mais tarde.

Bem, vai? Nós criamos: m.habr.com