Presentación de mi ponencia en WordCamp Sevilla 2018 (7 - 8 julio), con título "WordPress y Medios: Diseñando la editorialización". ¿Qué son y cómo se diseñan los portales verticales? En esta charla hablo sobre ello y pongo algunos de ejemplos de proyectos reales que he realizado para ABCdesevilla (BulevarSur y Gurmé).

1. WordPress y Medios:
diseñando la editorialización

2. 1
Introducción
Contenido y objetivos
Perfil profesional

3. Contenido y objetivos
Hablaremos de diseño de producto digital
Como servicio, metodología y herramienta
Orientados a la creación de temas ad-hoc
Y de diseño de temas de WordPress
Aquellos medios que se construyen con WordPress #CapitánObvio
En el contexto de los medios digitales
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018

4. Contenido y objetivos
No vamos a ver código
#SADdevelopers :’-(
Afianzaremos de dónde venimos, Gutenberg es el futuro
No vamos a hablar de Gutenberg
Pero puedo improvisar chascarrillos
No habrá GIF graciosos
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018

5. Perfil profesional
Abel Sutilo
Diseñador de Producto Digital
@abelsutilo
Concepto Diseño Código
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018

6. 2
Contexto y mercado
Qué entendemos por medios digitales
Portales verticales: más allá de los blogs
Contenido, estructura y modularidad

7. Qué entendemos por medios digitales
Temática especifica
Contenido en torno a una temática o sector determinado
Impresiones, Segmentación, Patrocinio
Publicidad como modelo de negocio
Consume contenido, resignifica contenido, distribuye contenido
El rol del usuario
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
¿Blog?

8. Qué entendemos por medios digitales
Portales verticales: más allá del blog
Noticia
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Opinión
Reportaje
Promocionado o Recomendado
Tipología según temática (Receta, Bares, Top 10, etc)
= Custom Post Type
Editorialización

9. Verticales
WeblogsSL Trendencias
NosotrasOcioMedia
BulevarSurABCdesevilla
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
(¿CMS?)
(Theme Forest Theme)
(WordPress Theme ad-hoc)
Temática: Estilo

10. Verticales: Estructura
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Editorialización= Custom Post
Reportaje
Noticia
Opinión
Rápidos
Publicidad

11. Verticales: Modularidad
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Editorialización= Widgets
Especiales
Listados
Archivos
Búsquedas
= Widgets

12. 3
Requisitos previos
Equipo cliente: de pains a goals
Perfil del diseñador

13. pain points
Diseñando la editorialización
Equipo cliente: De pains…
Redactores
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
SEO
Editorial
1. Tipos de contenidos
2. Modularidad
Front
Back
Desarrolladores
1. Integración estándar WP
2. Sostenible y escalable
Comerciales
Marketing
MK y Ventas
1. Espacios para publicidad
2. Integración publicidad externa

14. goals
Diseñando la editorialización
Equipo cliente: …A goals
Diseño por
componentes
(Sistema de
diseño)
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Editorial
Diseño
‘Codex
Friendly’
Desarrolladores
Diseñar
respetando
espacios para
publicidad
(estándar)
MK y Ventas
1. Espacios para publicidad
2. Integración publicidad externa
1. Tipos de contenidos
2. Modularidad
1. Integración estándar WP
2. Sostenible y escalable

15. Diseñando la editorialización
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Utiliza un lenguaje no técnico Lenguaje técnico y solución abstracta
Solución del desarrollador
Traducción visual del modelo abstracto
a través del diseño de interfaz
Concepto editorial

16. Diseñando la editorialización
Perfil del diseñador
WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Evitar efecto “PA K KIERES SABER ESO JAJA SALUDOS”
Esto va más allá de la chapa y pintura
HTML y CSS son obligatorios
Construir sobre lo que somos para llegar a lo que se quiere ser
Interiorizar el modelo de negocio
Usuario de WordPress

17. 4
Proceso de diseño
(BulevarSur y Gurmé)
Definiendo áreas (Dynamic Sidebars)
Creación del sistema de diseño
Del sistema al tema

18. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Definiendo áreas (Dynamic Sidebars)
Editorialización

19. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Definiendo áreas (Dynamic Sidebars)
Desarrollo
Modulos-AB-1
Modulos-ABC-2
Modulos-ABC-3
Modulos-AB-3
Editorialización
etc

20. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Definiendo áreas (Dynamic Sidebars)
Desarrollo
Modulos-AB-1
Modulos-ABC-2
Modulos-ABC-3
Modulos-AB-3
Editorialización
Reportajes
Noticias
Opinión

21. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Creación del Sistema de Diseño

22. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Creación del Sistema de Diseño
Título
Categoría
Etiqueta
Campo personalizado
Imagen destacada
Plugin
Codex Friendly

23. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Creación del Sistema de Diseño
Recursos del equipo cliente: Facilitando mantenimiento
Cover

24. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Creación del Sistema de Diseño
Recursos del equipo cliente: Facilitando mantenimiento
CoverCover

25. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Creación del Sistema de Diseño
Átomos, Moléculas, Organismos, Templates y Páginas

26. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Creación del Sistema de Diseño
Átomos, Moléculas, Organismos, Templates y Páginas

27. WordPress y Medios: diseñando la editorialización
WordCamp Sevilla 2018
Creación del Sistema de Diseño
Del sistema al tema

28. 5
El futuro próximo
La misma metodología de diseño
…con Gutenberg?

29. ¿Preguntas?
(Sólo las fáciles, por favor :P)
Diseñador de Producto Digital
@abelsutilo
Abel Sutilo
¡Gracias!