Christos Pantazis - WordPress Themes, Marketplaces vs clients - WordCamp Athens 2016

Transcript

1. O X Y G E N N A
2. Wordpress themes: Marketplaces vs Clients WORDCAMP ATHENS 2016 PROS & CONS FROM THE DESIGNING POINT OF VIEW
3. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A The process of designing a theme for a marketplace is different compared to when designing for a client. In this presentation we’ll focus on these differences on every step starting from getting the inspiration, defining the concept, choosing the tools, defining the features, down to the final design of a wordpress theme. W O R D C A M P A T H E N S 2 0 1 6
4. ABOUT US Ι / introduction
5. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 1. / Intro We are a small creative web design agency who are passionate with our pixels. We specialise in WordPress theme development using the Bootstrap Framework and create pixel perfect themes. We started designing Wordpress themes for clients and then moved into selling our themes in marketplaces.
6. W o r d p r e s s T h e m e s : C l i e n t s V s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ O X Y G E N N A 2002 THE START Start working part time in the web design/ development industry on the ie6 years 2006 OXYGENNA Co-Founded Oxygenna and started on small html and Joomla projects 2007 WORDPRESS Introduced into the wordpress world and created our first Wordpress theme for a client. 2011 NO CLIENTS The big decision to give up on clients and start selling wordpress themes to marketplaces. 2. / Storyline
7. W o r d p r e s s T h e m e s : C l i e n t s V s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ O X Y G E N N A 2012 FIRST SALE Our first theme got accepted on Themeforest. 2016 NOW Manage to move from to zero to almost 20.000 clients
8. ∠ | ∠ L A M B D A 3 2 0 0 S a l e s O M E G A 2 3 0 0 S a l e s A N G L E 2 5 0 0 S a l e s 3. / Works
9. DESIGNING ΙΙ / Wordpress
10. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 1. / So What is it? There are many definitions on what design is, but what we need to think more is what we should thing about our roles in this industry. So we should really ask ourselves what it really is..
11. Design is about telling a story and engaging the viewer to react to it.
12. ∠ | ∠ ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A T Y P O G R A P H Y L A Y O U T C O L O R I M A G E S ANIMATIONS 2. / Design Variables 1 2 3 4 5
13. ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A 01 RESEARCH The first step in designing a successful web site is to gather information. 02 . PLANNING Using the information gathered from phase one, it is time to put together a plan & deadlines for your web site. 03 . DESIGN Drawing from the information gathered up to this point, it’s time to determine the look and feel of your site 04 DEVELOPMENT The developmental stage is the point where the web site itself is created. 3. / Design steps
14. ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A 05 TESTING & DELIVERY At this point, your web designer will attend to the final details and test your web site. 06 . MAINTENANCE & UPDATING The development of your web site is not necessarily over, though. One way to bring repeat visitors to your site is to offer new content or products on a regular basis.
15. CLIENTS vs MARKETPLACES ΙΙΙ / From the designer Point Of View
16. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 1. / Research The first step in designing a successful web site is to gather information. Many things need to be taken into consideration when the look and feel of your site is created. This first step is actually the most important one, as it involves a solid understanding of the company it is created for. It involves a good understanding of you – what your business goals and dreams are, and how the web can be utilized to help you achieve those goals.
17. ∠ | ∠ ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A • Clients defines the purpose. • Focus on real competition. • Focus on client's wishes and expectations. • Smaller target audience. • Research client's current business process. • Analyse the client's current online presence (if any). • We need to define the theme’s purpose. • Focus on real site competition. • Focus on other theme’s competition. • Wider target audience. Clients Marketplaces
18. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 2. / Planning Using the information gathered from phase one, it is time to put together a plan for your web site. In this phase we need to take serious decisions based on factors like the deadline, the budget the features support, the browser target range and the technologies to be used. During the planning phase a storyline might be useful to help us focus on the design phase.
19. ∠ | ∠ ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A • Clients sets the budget. • Clients sets the deadline. • Sitemap based on clients needs. • Features defined by user specific needs. • No set budget. • No set deadline. • Sitemap should cover average buyers needs. • Features based on competition. Clients Marketplaces
20. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 3. / Design Drawing from the information gathered up to this point, it’s time to determine the look and feel of your site. Target audience is one of the key factors taken into consideration. A site aimed at teenagers, for example, will look much different than one meant for a financial institution. As part of the design phase, it is also important to incorporate elements such as the company logo or colors to help strengthen the identity of your company on the web site.
21. ∠ | ∠ ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A • Clients gives the basic feedback • Main design variables (logo, colors, typeface) are depended on client • Design choices can be altered by client. • Source of feedback could be design sites (dribble, behance) • Depending on planning variables should be able to be defined by end users . • Design choices should stick on planning phase. Clients Marketplaces
22. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 4. / Development The developmental stage is the point where the web site itself is created. At this time, your web designer will take all of the individual graphic elements from the prototype and use them to create the actual, functional site. This is typically done by first developing the home page, followed by a “shell” for the interior pages. The shell serves as a template for the content pages of your site, as it contains the main navigational structure for the web site. Once the shell has been created, your designer will take your content and distribute it throughout the site, in the appropriate areas.
23. ∠ | ∠ ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A • Development phase should stick on what’s already decided on the planning phase. • Development can be changed based on changes on the supported features (plugin updates etc). Clients Marketplaces
24. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 5. / Testing & Delivery At this point, we need to attend to the final details and test the web site. Testing things such as the complete functionality of forms or other scripts, as well last testing for last minute compatibility issues (viewing differences between different web browsers), ensuring that the theme is optimised to be viewed properly in the most recent browser versions. As part of testing, the designer should check to be sure that all of the code written for your web site validates. Valid code means that the theme the current web development standards – this is helpful when checking for issues such as cross-browser compatibility as mentioned above.
25. ∠ | ∠ ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A • Browser testing can be limited by client’s target group. • Installation of the theme and plugins can be done by us. • Basic documentation needed. • Browser testing can should cover a wide range of end users. • Installation should be covered by mechanisms easy to use for the average end users. • Extensive documentation needed. Clients Marketplaces
26. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 6. / Maintenance & Updates The development of your web site is not necessarily over, though. One way to bring repeat visitors to your site is to offer new content or products on a regular basis. Most web designers will be more than happy to continue working together with you, to update the information on your web site. Many designers offer maintenance packages at reduced rates, based on how often you anticipate making changes or additions to your web site.
27. ∠ | ∠ ∠ | ∠ W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A • Maintenance can be minimal and only restrict to users feedback. • Updating can only be defined on a new deal with clients. • Only one client to handle. • Maintenance can be extensive due to the number of end users. • Updating can depend on the volume of sales and depending on the marketplace can be a source of income. • Vast number of clients to deal with. Clients Marketplaces
28. SUMMARY ΙV / Some final thoughts
29. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 ∠ | ∠ ∠ | ∠ O X Y G E N N A 1. / So What’s Best? Designing a Wordpress theme for Clients might be a completely different task compared to when designing for a marketplace. The main differences are based on the fact that a client sets the deadline and the budget and that pretty much defines the features of the design process. Design for a marketplace on the other hand has a level of uncertainty that can only be handled by the experience of the designer.
30. W o r d p r e s s T h e m e s : C l i e n t s v s M a r k e t p l a c e 2 0 1 6 O X Y G E N N A SOCIAL MEDIA www.facebook.com/ oxygenna twitter.com/oxygenna INSPIRATIONS SHOTS dribbble.com/oxygenna WEBSITE & EMAIL www.oxygenna.com info@oxygenna.com 2./ Stay in touch with us C o n t a c t U s
31. T H A N K Y O U O x y g e n n a 2 0 1 6