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

Transcript

1. O X Y G E N N A
   

   View Slide

2. Wordpress themes: Marketplaces vs Clients
   WORDCAMP ATHENS 2016
   PROS & CONS FROM THE DESIGNING POINT OF VIEW
   

   View Slide

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
   

   View Slide

4. ABOUT US
   Ι /
   introduction
   

   View Slide

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.
   

   View Slide

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
   

   View Slide

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
   

   View Slide

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
   

   View Slide

9. DESIGNING
   ΙΙ /
   Wordpress
   

   View Slide

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..
    

    View Slide

11. Design is about telling a story and
    engaging the viewer to react to it.
    

    View Slide

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
    

    View Slide

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
    

    View Slide

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.
    

    View Slide

15. CLIENTS vs
    MARKETPLACES
    ΙΙΙ /
    From the designer Point Of View
    

    View Slide

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.
    

    View Slide

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
    

    View Slide

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.
    

    View Slide

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
    

    View Slide

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.
    

    View Slide

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
    

    View Slide

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.
    

    View Slide

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
    

    View Slide

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.
    

    View Slide

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
    

    View Slide

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.
    

    View Slide

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
    

    View Slide

28. SUMMARY
    ΙV /
    Some final thoughts
    

    View Slide

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.
    

    View Slide

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
    

    View Slide

31. T H A N K Y O U
    O x y g e n n a
    2 0 1 6
    

    View Slide

32. View Slide