Successfully reported this slideshow.

WordCamp Barcelona 2015 : From Design to a Theme

0

Share

Loading in …3
×
1 of 27
1 of 27

WordCamp Barcelona 2015 : From Design to a Theme

0

Share

Download to read offline

The project manager journey.
What to take care and analyze the a web design production into a WordPress Theme.
Learn the different types of content sources and administration and organice the development of that design in a way that content creator can understand how the Theme works.
It helps you to calculate the time and effort of a project.

The project manager journey.
What to take care and analyze the a web design production into a WordPress Theme.
Learn the different types of content sources and administration and organice the development of that design in a way that content creator can understand how the Theme works.
It helps you to calculate the time and effort of a project.

More Related Content

WordCamp Barcelona 2015 : From Design to a Theme

  1. 1. Del Disseny al Tema El camí del Cap de Projecte
  2. 2. Del Diseño al Tema El camino del Jefe de Proyecto
  3. 3. From Design to a Theme The Project Manager Journey
  4. 4. lonchbox.com Pancho Pérez — Technical Designer @lonchbox lonchbox@gmail.com Founder and COO of @33themes
  5. 5. – Cate Blanchett “When you're directing something, you absolutely have to be involved in all layers of the process.”
  6. 6. Theme Layers Publishing Administration Frequency Source Content
  7. 7. – Unknown. I don't remember if I said ;) “We build the interface and functionalities of the website for the client but it belongs to them”
  8. 8. Build with Content From a Wishlist to Reality nebulafire.deviantart.com
  9. 9. The content process 1. Brief 2. Workshop 3. Sitemap 4. Media (Photos & Images) 5. Texts & Translations
  10. 10. Sources of content ‣ Internal ‣ External ‣ Dynamic ‣ Static
  11. 11. Frequency of publication ‣ Sporadically ‣ Once a month ‣ Frequently
  12. 12. Managing content ‣ Group content ‣ Sections ‣ Content position ‣ Dynamic content ‣ “Static” content
  13. 13. Content Creation ‣ Dashboard editor ‣ Publishing client ‣ Mobile / Tablet App ‣ Social networks ‣ Third party integrations
  14. 14. – Scott Belsky “… As for Designers, they are the biggest winners of all. Designers become the most important leaders of this new business era …”
  15. 15. Designing for web Where things grow and move Amazon
  16. 16. Theme concept design • Don´t fear the scroll • Text is not static, every word can be a different size • Fixed height does´t help • Mobile first ? • WebFont • Font icons vs Vector vs Sprite • Responsive vs / or Adaptative
  17. 17. desktop - tablet -mobile
  18. 18. mobile - tablet -desktop
  19. 19. tablet - mobile -desktop
  20. 20. Assembling the layers Atomized, unified and interlaced Iron Man 3 : Marvel
  21. 21. Theme content structure Core Post Page Category & tag Comments Media New Custom post types Custom Fields Custom taxonomies Theme options Customizer options
  22. 22. Theme content position Backend New menu position New section Sidebars Theme options Settings New menu Frontend Menu areas Loop areas Widgets “Static” content Featured content
  23. 23. Theme production Header Footer Menus Sidebars header.php /inc/custom-header.php footer.php functions.php /inc/custom-menus.php functions.php /inc/sidebars.php
  24. 24. Theme production Page templates Blog templates CPT single & archives TAX archives /page-title page.php templage-SLUG.php about.php front-page.php /blog /post-title index.php single.php CPT-SLUG/CPT-title single-CPT-SLUG.php /CPT-SLUG archive-CPT-SLUG.php /TAX-SLUG taxonomy-TAX-SLUG.php taxonomy-TAX-SLUG-term.php
  25. 25. Theme frameworks Structure Custom content Template Theme options /src/less /src/bootstrap /src/js Plugin: Pods Framework /inc/wp-bootstrap-menu-walker.php Plugin: Pods or Redux
  26. 26. Examples
  27. 27. Gracis, Gracias, Thanx :) @lonchbox

×