Casa Social media Social Media Design: Inspiring Tumblr Designs - dummies

Social Media Design: Inspiring Tumblr Designs - dummies

Sommario:

Video: Social Media For Designers: Instagram and Pinterest 2024

Video: Social Media For Designers: Instagram and Pinterest 2024
Anonim

Il tipico blog Tumblr era solo un lungo flusso di foto centrato con alcuni frammenti di testo sparsi ovunque e molti blog di Tumblr mantengono ancora quell'aspetto di base. Tuttavia, la tendenza negli ultimi anni è stata quella di provare a uscire da quel rigido formato verticale, sfruttando le funzionalità HTML5 e CSS3 incorporate nei moderni browser web.

Alcuni web designer creano design accattivanti che invitano a fare clic sui contenuti; altri sembrano aver esagerato con tutta la libertà.

Cory Doctorow

L'autore eccentrico di fantascienza Cory Doctorow (forse meglio conosciuto come uno dei blogger fondatori di BoingBoing) usa il suo blog Tumblr "Mostly Signs, Some Portents" come luogo per postare " Le cose che Cory ha visto Doctorow. "

Il banner per il sito ti dà una chiara idea di cosa ti aspetta: scarpe da tennis riccamente decorate, alieni dello spazio funky, merendine e una foto dell'autore apparentemente attaccata da un'orribile mano mostruosa verde. Doctorow usa un diverso collage di immagini per riflettere la natura eclettica dei suoi post e per rivelare il suo senso dell'umorismo alquanto assurdo nel suo design di Tumblr.

Credit: Cory Doctorow

Coca-Cola

Coca-Cola porta azione accattivante al suo Tumblr con gif animate, correndo concorsi che invitano le persone a inviare le loro brevi sequenze animate. Esecuzione di concorsi su siti sociali, come Tumblr, è un ottimo modo per coinvolgere i visitatori del sito e può aiutarti a popolare il tuo blog Tumblr con contenuti, premiando i tuoi clienti più fedeli e trasformandoli in fan.

Le tecniche di progettazione web reattiva utilizzate qui consentono al blog Tumblr di adattarsi alla larghezza dello schermo dell'utente, sia esso un display standard o un display ultra wide.

Wolfram | Alpha

Il "motore di risposta" scientifico Wolfram | Alpha utilizza sottili grafica pastello sul suo blog Tumblr. I pignoni, gli ingranaggi e le cinghie di collegamento sono tutti echi del logo dell'azienda. La grafica minimizzata funziona bene come spunto di progettazione per i calcoli delicati e intricati che puoi fare usando Wolfram | Alpha.

I post della compagnia sono illustrazioni di come è possibile utilizzare la combinazione di ricerca e abilità computazionali scientifiche di Wolfram | Alpha per capire le cose, come quando la sonda spaziale Rosetta ha viaggiato mentre si dirigeva verso la cometa 67P / Churyumov- Gerasimenko … o quanto tempo ci sarebbe voluto per viaggiare da Los Angeles a New York se si stesse cavalcando un ghepardo a tutta velocità per tutto il tragitto.

Risposte: 499 milioni di miglia e 33 ore, rispettivamente, anche se il povero ghepardo sarebbe stato piuttosto raggelato al momento del tuo arrivo.

Red Bull

Questa azienda di bevande energetiche è diventata leader nei media digitali. La pagina di Tumblr della Red Bull è un luogo in cui l'azienda promuove gli sport estremi, il tipo di contenuti aggressivi e cangianti che si adattano alla sua immagine aziendale di essere il drink di scelta per le persone che fanno cose folli.

Red Bull ha creato una pagina con quattro grandi schede di navigazione: Play, Fly, Create e Inspire, ciascuna delle quali porta a una pagina secondaria del suo sito Tumblr. Il design grintoso in bianco e nero si adatta a questa pagina; sembra che sia stato sbattuto un po ', ma è ancora in piedi. Il design semplice non toglie le colorate GIF animate che sono il contenuto principale di questa pagina.

Usare una pergamena infinita nel modo in cui Red Bull nella sua progettazione può fornire un'esperienza eccezionale, apparentemente senza fine ad alcuni utenti, ma i browser Web più vecchi possono talvolta bloccarsi o bloccarsi quando si tenta di caricare soddisfare.

RadioLab

Le storie che escono da Radiolab vengono trasmesse su stazioni NPR in tutto il mondo, ma a volte c'è un aspetto della storia che è meglio raccontare con le immagini.

Il design pulito e essenziale del blog RadioLab di New York City mette l'accento sulle immagini. Radiolab, ospitato da Jad Abumrad e Robert Krulwich, produce anche un popolare podcast.

Il loro blog Tumblr ben progettato mescola brevi post, citazioni e immagini che illustrano molti degli stessi argomenti trattati dai due nei loro podcast e programmi radiofonici. I due hanno attratto un forte seguito ponendo domande provocatorie e esplorando la scienza e la tecnologia eccentriche.

Documento di oggi

Ogni giorno nel Tumblr del documento di oggi, troverai un'immagine, un video o una GIF animata che presenta un evento notevole avvenuto lo stesso giorno nella storia. Secondo la pagina Informazioni sul sito, il documento di oggi è iniziato come una piccola caratteristica sugli archivi. gov website diversi anni fa come un modo per evidenziare documenti interessanti dagli archivi nazionali.

L'uso di Tumblr per mostrare e condividere i documenti più popolari o più richiesti dimostra come Tumblr possa servire come complemento di un sito web molto più grande, come quello di Archives. org.

Social Media Design: Inspiring Tumblr Designs - dummies

Scelta dell'editore

Come utilizzare la notazione oggetto script Java nelle app iOS - dummies

Come utilizzare la notazione oggetto script Java nelle app iOS - dummies

Notazione oggetto javaScript (JSON) è diventato lo standard di fatto in termini di rappresentazione dei dati nelle app iOS. È possibile utilizzare JSON per trasferire dati sul Web e come formato per il salvataggio e il recupero di dati di lunga durata. JSON è al contempo leggibile e facile da capire per le macchine. I dati in JSON possono essere inclusi in uno ...

Come usare Frammenti per programmare la tua app Android - dummies

Come usare Frammenti per programmare la tua app Android - dummies

L'interfaccia utente nel L'esempio di app per Android qui utilizzato ha tre pannelli: un elenco di elementi, un pannello di dettagli che descrive l'elemento selezionato nell'elenco e un pannello di dettagli in profondità. Su un piccolo schermo dello smartphone, ogni pannello potrebbe essere un'attività separata. Ma uno schermo tablet in modalità orizzontale ha spazio per ...

Come utilizzare Xcode Instruments per raccogliere dati per le app iOS - dummies

Come utilizzare Xcode Instruments per raccogliere dati per le app iOS - dummies

Xcode fornisce uno strumento per sviluppatori che consente la traccia dinamica e la profilazione del codice iOS per aiutarti a comprendere il comportamento congiunto sia del codice dell'app che del sistema operativo. Si chiama Instruments. Per utilizzare questo strumento, segui questi passaggi: Scegli Xcode → Apri strumento di sviluppo → Strumenti. Viene visualizzata la finestra Strumenti che mostra una raccolta di modelli. Tu ...

Scelta dell'editore

Filosofia Argomenti da studiare per il Miller Analogies Test (MAT) - dummies

Filosofia Argomenti da studiare per il Miller Analogies Test (MAT) - dummies

You non dovremo sfuggire a qualsiasi confuso testo di filosofia per fare bene con la filosofia sul MAT. Per eccellere nelle analogie MAT sulla filosofia, tutto ciò che devi sapere sono i principali filosofi della storia, i loro lavori e alcuni termini di base della filosofia. Termini filosofici che appaiono nel test MAT Spazzolate le vostre conoscenze ...

Come applicare la conoscenza della certificazione PHR / SPHR sul lavoro - dummy

Come applicare la conoscenza della certificazione PHR / SPHR sul lavoro - dummy

Dopo aver Con successo ottenuto la certificazione PHR / SPHR, il tuo ruolo sul lavoro sta per cambiare. Non è solo perché ora hai le iniziali accanto al tuo nome. Il processo di preparazione ti ha insegnato nuove cose e, come professionista consumato, inizierai a cercare cambiamenti nel tuo gruppo di lavoro. Queste modifiche si applicano in ...

Passando la Parte I del GED - dummies

Passando la Parte I del GED - dummies

Parte I delle Arti del linguaggio, Writing Test ti chiede di leggere e quindi rivedere e modificare i documenti che possono includere informazioni sulle procedure e materiale sul posto di lavoro. Questo test non è malvagio. Solo perché non hai preso la grammatica per anni non significa che non lo sai. Probabilmente sai più di quanto pensi. Le domande sono tutte ...

Scelta dell'editore

Come allineare il contenuto della tabella in colonne e righe in Dreamweaver - dummies

Come allineare il contenuto della tabella in colonne e righe in Dreamweaver - dummies

Pulire l'allineamento degli elementi in colonne e righe rende il tuo tavolo pulito e facile da leggere. Raggiungere quell'aspetto in Dreamweaver può essere complicato perché non si ha il massimo controllo in HTML di un programma come Excel, in cui è possibile allineare i numeri al punto decimale, ad esempio. In un ...

Come allineare elementi con float in Dreamweaver - dummies

Come allineare elementi con float in Dreamweaver - dummies

I designer spesso allineano un'immagine, un tag, o un altro elemento a sinistra oa destra di una pagina Web in Dreamweaver e quindi avvolgere qualsiasi testo o altro contenuto intorno a quell'elemento. L'immagine è allineata a destra della colonna in modo che il testo si sposti accanto a essa a sinistra. In ...

Come verificare la compatibilità CSS in Adobe Dreamweaver CS6 - dummies

Come verificare la compatibilità CSS in Adobe Dreamweaver CS6 - dummies

È Importante assicurarsi che Adobe Il sito Web di Dreamweaver CS6 viene visualizzato correttamente e in modo coerente su tutti i browser più diffusi, come Internet Explorer, Firefox, Chrome e Safari. Sebbene la maggior parte dei browser moderni abbia adottato un supporto abbastanza uniforme per le proprietà CSS2 (e alcuni CSS3), i progettisti dovrebbero comunque testare le loro pagine in una varietà di browser e browser ...