Como projetar sua comunidade no Ning

Publicados: 2018-05-16

Embora o conteúdo seja, sem dúvida, o ativo mais valioso da sua rede Ning, o design também deve ser levado muito a sério . Não importa o quão relevante e envolvente seja o seu conteúdo, ninguém ficaria particularmente animado para navegar em um site feio, certo? A verdade é que 38% das pessoas desistem de se envolver com um site se o acharem pouco atraente . Obviamente, como criador de redes, você não quer perder tanto público. Pelo contrário, você deseja que os usuários fiquem felizes com cada aspecto de sua criação.

Um design de rede visualmente atraente e amigável ajuda você a prender a atenção das pessoas e garantir a melhor experiência de usuário possível. Não é apenas uma questão de beleza estética. Contanto que o design do seu site seja profissional e intuitivo, mais usuários desejam interagir com ele, portanto, mais pessoas ingressam na sua rede e mais tráfego você direciona para o seu site.

Além disso, um design único e individualista pode fazer com que sua rede se destaque das demais e revelar sua verdadeira identidade. Afinal, estamos falando de redes sociais personalizadas pelas quais o Ning é conhecido.

Mas como criar um site que tenha uma aparência legal e seja um prazer de navegar? Aqui estão algumas dicas úteis para quem está começando a explorar a plataforma Ning e seus recursos.

Introdução ao NING Design Studio

Uma das principais prioridades do Ning sempre foi dar aos usuários o máximo controle sobre a aparência visual de suas redes. É por isso que o Design Studio foi criado.

NING Design Studio é um conjunto de ferramentas que permite personalizar o design de sites sociais criados na plataforma Ning. Ele oferece aos usuários uma abundância de opções de personalização com o objetivo de tornar cada rede Ning única e bonita.

O Design Studio pode ser facilmente iniciado clicando no ícone correspondente no painel de administração, que está disponível como uma barra de ferramentas verde no canto superior esquerdo de cada página da rede.

Existem várias categorias de personalização disponíveis no menu Design Studio:

  • Temas : selecione um modelo de design geral para o seu site;
  • Plano de fundo : escolha e configure a imagem que aparece no pano de fundo do seu site;
  • Cabeçalho : crie um cabeçalho que corresponda ao tópico de sua rede;
  • Página : defina a aparência geral de suas páginas de rede;
  • CSS personalizado : insira o código CSS personalizado para fazer alterações avançadas no design do seu site.

Cada categoria contém várias opções de personalização distintas. Para desenhar um site que tenha um aspecto verdadeiramente profissional, não tenha pressa e passe gradualmente de uma categoria a outra, definindo os parâmetros de cada elemento da sua rede de acordo com a sua visão criativa. Você pode configurar praticamente todos os aspectos do design do seu site para corresponder às suas preferências estéticas.

Além disso, o Design Studio permite que você visualize todas as alterações feitas antes que elas sejam realmente aplicadas à sua rede. Isso torna o processo de personalização muito conveniente e intuitivo.

Na verdade, usar o Design Studio não requer nenhum conhecimento técnico e habilidade, pois cada elemento de design pode ser facilmente modificado com a ajuda de uma interface amigável. No entanto, para ter uma ideia básica sobre as opções de personalização que você tem à sua disposição, vamos analisá-las em mais detalhes.

Tema

Um tema é um modelo que determina o design básico do seu site. Ao aplicar um tema à sua rede, você aplica uma combinação predefinida de elementos de design, incluindo um cabeçalho, imagem de fundo, layout de página, barra de navegação, fontes, etc.

O Ning oferece uma ampla seleção de temas prontos para uso meticulosamente projetados para diferentes tipos de sites. Precisa de um site de portfólio? Vá escolher o tema correspondente na biblioteca. Quer criar uma comunidade musical? Sem problemas, o Ning também tem modelos para isso!

Você pode encontrar toda a gama de temas desenvolvidos pelo Ning na guia “Temas” do menu do Design Studio.

tela1 Basta escolher aquele que melhor se adapta ao seu propósito e clicar no botão “Publicar”. Antes de aplicar um tema, você pode visualizá-lo.

Os temas do Ning têm uma ótima aparência em desktops e dispositivos móveis, pois foram cuidadosamente otimizados para o melhor desempenho em todas as plataformas existentes.

Além disso, a guia “Temas” contém duas subguias:

  • Histórico : permite que você reveja todos os temas que aplicou ao seu site de rede antes;
  • Gerenciar : aqui você pode importar e exportar temas; o Design Studio oferece suporte a temas no formato .txt.

Embora você possa usar os temas predefinidos como estão, também é possível personalizá-los ainda mais para obter um design totalmente exclusivo.

Fundo

Comece a personalizar seu tema definindo uma imagem de fundo. Existem duas maneiras simples de fazer isso:

  • Selecione uma das imagens padrão oferecidas pelo Ning;
  • Carregue sua própria imagem e aplique-a como plano de fundo.

Para fazer upload de sua própria imagem, selecione a guia “Plano de fundo” e clique no ícone da câmera.

À direita da lista de seleção de imagens, você encontrará várias opções adicionais para ajustar sua imagem de plano de fundo:

  • Cor : defina a cor do seu plano de fundo;
  • Alinhamento e orientação : escolha uma das nove posições para sua imagem de fundo;
  • Renderização : defina como sua imagem de fundo será renderizada na página; há cinco opções disponíveis no menu suspenso: Lado a lado, Lado a lado horizontalmente, Lado a lado verticalmente, Esticado e Normal.
  • Opção de rolagem : você pode habilitar a rolagem ou corrigir a posição da imagem de fundo marcando o botão de opção correspondente.

Quando terminar com sua imagem de fundo, é hora de passar para o cabeçalho, um dos elementos mais importantes do design do seu site.

Cabeçalho

Um cabeçalho é um bloco que contém as informações introdutórias sobre um site (nome, logotipo, etc.) e uma barra de navegação. Um cabeçalho permanece visível em todas as páginas de um site e geralmente está localizado na parte superior, embora às vezes também possa ser colocado no lado direito ou esquerdo de uma página, dependendo do conceito de design.

Para começar a projetar o cabeçalho do seu site, clique na guia “Cabeçalho”. cabeçalho

Na guia, você encontrará várias subguias que permitem definir diferentes parâmetros de seu cabeçalho:

  • Estilo :

Aqui você pode definir a posição e orientação da plataforma. A opção clássica é um cabeçalho localizado na parte superior, contendo uma imagem de fundo, nome da rede, logotipo e barra de navegação abaixo. No entanto, você pode considerar outras variantes disponíveis para fazer sua rede se destacar.

Além disso, você é livre para alterar o tamanho (altura e largura) de seu cabeçalho e seu preenchimento, inserindo os valores necessários (em pixels) nas caixas correspondentes.

Dica O limite de altura padrão para a maioria dos temas é 135 px.

  • Nome / Logo :

Uma das funções essenciais de um cabeçalho é comunicar o nome de um site (ou o nome de uma empresa / marca). Para completar a imagem, você também vai querer mostrar o seu logotipo. Com o NING Design Studio, você pode personalizar facilmente o nome e o logotipo.

Para definir um nome de rede, vá para “Configurações Gerais” do menu “Gerenciador de Site Social” acessível a partir do Painel de Administração e insira o nome na caixa de texto “Nome do Site”.

Você pode então voltar ao Design Studio e selecionar o estilo, a cor e o tamanho da fonte aplicada ao nome do seu site.

Quando terminar de personalizar o nome da rede, é hora de fazer upload do seu logotipo. Para fazer isso, basta clicar no ícone da câmera e localizar o arquivo de imagem desejado em seu computador.

Assim que o logotipo for carregado, você pode regular seu tamanho com a ajuda da barra deslizante localizada à direita. Você também pode alterar o tamanho do preenchimento e o alinhamento do seu logotipo.

  • Navegação

Este menu permite que você personalize sua barra de navegação. Você pode alterar a cor de fundo e o tipo de borda, ajustar fontes para guias e subguias, definir cores, controlar o efeito de foco, modificar o tamanho do preenchimento da guia e regular o espaçamento entre as guias.

  • Fundo

Para deixar seu cabeçalho bonito e único, defina uma imagem de plano de fundo com boa aparência para ele.

O menu “Plano de fundo” permite que você personalize o plano de fundo da tela e o plano de fundo de largura total. Isso abre mais maneiras de experimentar o design do cabeçalho, permitindo que você escolha a combinação certa de cores e imagens. Tente encontrar aqueles que correspondam ao tema de design que você selecionou, bem como o tópico de sua rede. Você é livre para ser tão criativo quanto quiser!

Encontrou as imagens adequadas? Boa. Basta carregá-los clicando no ícone da câmera e ajustar seu posicionamento e alinhamento - fácil!

Você também pode querer editar suas imagens para que se ajustem ao tamanho do cabeçalho, aplicar filtros e efeitos, etc. Para fazer isso, use uma ferramenta de edição de imagens online, por exemplo, BeFunky ou Pixlr .

  • Barra de Contas

Aqui você pode definir a cor da barra da conta exibida na parte superior de cada página da rede. Você pode controlar a cor de fundo, a cor do texto e o efeito de foco. Além disso, existe a opção de fixar a barra da conta no topo da janela do navegador.

Página

A guia “Página” do menu do Design Studio está lá para ajudá-lo a personalizar a aparência geral de suas páginas de rede. Ele contém várias subguias:

  • Geral : Defina a cor do fundo da página, selecione as fontes que aparecem nas páginas, regule o espaçamento dos parágrafos, modifique o tamanho do preenchimento da página e a largura da página. Se você deseja que seu site seja executado no modo de tela inteira, selecione “100%” no menu suspenso “Largura da página”.
  • Módulo : Controle os parâmetros dos módulos. Módulos são blocos de conteúdo que aparecem em todas as páginas da sua rede. Você pode alterar sua cor de fundo, fontes, bloco e preenchimento de conteúdo, alinhamento de bloco, etc.
  • Links : personalize a aparência dos links apresentados no site, incluindo botões de navegação da página e títulos de postagens.
  • Botões : ajuste o design dos botões que executam várias ações no site.
  • Efeitos : torne os cantos das páginas e módulos de conteúdo nítidos ou arredondados e defina a forma das fotos de perfil.

CSS customizado

Se as opções de personalização embutidas não forem suficientes para você e se você não for novato em programação, explore a guia “Custom CSS”. Ele permite que você insira um código CSS personalizado e, assim, aplique modificações avançadas ao design do seu site.

Existem duas áreas onde o código CSS pode ser inserido:

  • CSS global : refere-se a personalizações universais;
  • CSS do tema : refere-se a personalizações específicas do tema.

Usuários experientes em tecnologia acharão o recurso Custom CSS particularmente útil para alcançar resultados ainda mais impressionantes em termos de apresentação visual.

Projete seu site perfeito

Projetar um site visualmente deslumbrante é uma questão de inspiração, criatividade e ferramentas de personalização versáteis. O NING Design Studio oferece essas ferramentas e o incentiva a desenvolver um site exclusivo e atraente que terá uma ótima aparência e será conveniente para navegar.

Esperançosamente, esta breve visão geral dos principais recursos do Design Studio ajudará você a criar um site social que realmente impressionará seu público. Enquanto isso, continue experimentando! Experimente coisas diferentes e suas combinações para chegar ao design do qual você ficará feliz e orgulhoso.


Brenda Peterson

Brenda é especialista técnica no Ning