Seize The Future Workshop: Wordpress Fundamentals & UX/UI Crashcourse

D663e7e3088a88f940c785d75c2d08d1?s=47 Jaychrist Teves
November 23, 2017

Seize The Future Workshop: Wordpress Fundamentals & UX/UI Crashcourse

Presented at Cavite State University, Carmona Campus. Nov 23, 2017

Sieze the Future Workshop was attended by 150+ aspiring designers and programmers. Giving the chance to engage to some of the best students within the university. My mission is to drop all the knowledge I have about UX/UI from the 7+ years of my career. Also, inspire them to innovate and maximize the resources we have in the PH.

D663e7e3088a88f940c785d75c2d08d1?s=128

Jaychrist Teves

November 23, 2017
Tweet

Transcript

  1. 2.
  2. 3.

    What is WordPress? • WordPress is a web software to

    create a blog or website • Highly flexible Content Management System (CMS) • Open source project (Free) • Huge community developing plugins, widgets, and themes
  3. 4.

    How does it work? • Install WordPress on your server

    in about five(5) minutes or use the cloud-based WordPress.com • Edit and manage your content in an easy to use web interface • Built on the widely popular PHP and mySql platform
  4. 5.

    Why use WordPress? • No need to learn HTML, CSS,

    Javascript, or other web-based languages • Open source, so it’s constantly being updated and improved • Not locked into one system, easily export and import data • Widely popular with easy to find support and third party enhancements • Customized your blog or site to meet your needs and design
  5. 7.

    FIVE KEY FUNDAMENTALS OF A GOOD WEB DESIGN JAYCHRIST TEVES

    SEIZE THE FUTURE – CVSU CARMONA 2017
  6. 10.
  7. 11.
  8. 12.
  9. 14.
  10. 17.
  11. 18.

    “Traffic has a value, and any website with purpose wants

    to do something with that traffic when it arrives.”
  12. 23.

    Thank you! Now it’s time for Q & A. Part

    One: Worpress Fundamentals LEARN MORE @ JAYCHRISTTEVES.COM AND CHECK MY WORK IN PROGRESS ON:
  13. 24.

    UX CRASH COURSE: EIGHT FUNDAMENTALS Basic UX Principles: How to

    get started JAYCHRIST TEVES SEIZE THE FUTURE – CVSU CARMONA 2017
  14. 25.

    INTRODUCTION & KEY IDEAS 1. WHAT IS UX? 2. USER

    GOALS AND BUSINESS GOALS 3. THE FIVE MAIN INGREDIENTS OF UX HOW TO UNDERSTAND USERS 4. WHAT IS USER RESEARCH? 5. HOW TO ASK PEOPLE QUESTIONS 6. CREATING USER PROFILES 7. DESIGNING FOR DEVICES 8. DESIGN PATTERNS >> UX / UI ACTIVITY
  15. 26.

    ONE: WHAT IS UX? • Everything has a user experience.

    Our job is not to create the user experience. It is our job to make it good • A user’s experience is just the tip of the iceberg • “Doing” UX
  16. 27.

    TWO: USER GOALS & BUSINESS GOALS • User Goals •

    Business Goals • Align the goals
  17. 28.
  18. 30.

    FIVE: HOW TO ASK PEOPLE QUESTIONS 3 basic types of

    questions: 1. Open Questions 2. Leading Questions 3. Closed/Direct Questions
  19. 31.

    SIX: CREATING USER PROFILES • Let’s list down what personas/profiles

    are NOT: Personality Types Demographics Character in your “brand story” Stereotypes based on your experience Shallow or 1-dimensional Concepts Predictions
  20. 32.

    It describes the goals, expectations, motivations, and behaviour of real

    people. Why do they come to your site? What are they looking for? What makes them nervous? And so on. WHAT IS PERSONA/PROFILE?
  21. 33.

    Persona A is a female, between the ages of 35-45

    with an above average income and education. They have at least one child and own at least one new vehicle. They are outgoing and career-oriented, and tend to be right- brain thinkers. BAD PROFILE
  22. 34.

    WHY IT’S BAD? Because it doesn’t allow you to say

    “no” to any feature ideas. What sort of features does a female between 35- 45 need? It could be anything!
  23. 35.

    Persona A is an experienced manager, mostly interested in one

    or two areas of expertise. They visit often, but they are pressed for time, so they focus on “collecting” content to read on the weekends. They tend to be prolific social media sharers, mostly to Twitter and LinkedIn. They consider themselves thought-leaders, so public image is important. USEFUL PROFILE
  24. 36.

    Now you have a lot of information to use! You

    know that fluffy content will not be popular, self-curating will be a big deal and you have a basis for setting up content categories. They need easy access to sharing, and only certain types of social sharing will be relevant. WHY IT’S USEFUL?
  25. 38.

    SEVEN: DESIGNING FOR DEVICES Step 1: How does it like

    to be touched? Step 2: Start small Step 3: What special powers does this device have? Step 4: Consider the software. Step 5: Be responsive. Step 6: Think about more than one screen at a time.
  26. 39.

    EIGHT: DESIGN PATTERNS “A design is not necessarily good just

    because it’s common. To be a “good” Design Pattern, a solution must be common and usable.”
  27. 40.

    EXAMPLE OF DESIGN PATTERN Now, there are hundreds of design

    patterns and they are changing all the time as devices and technologies evolve, so I can’t really make you a list. But, here’s a few of it that I feel a great fit for this lesson. Source: www.goodui.org
  28. 42.

    Idea Two: Try Giving a Gift instead of closing a

    sale right away. Source: www.goodui.org
  29. 49.
  30. 50.
  31. 51.

    Thank you! Now it’s time for Q & A. Part

    Two: UX CRASH COURSE: EIGHT FUNDAMENTALS LEARN MORE @ JAYCHRISTTEVES.COM AND CHECK MY WORK IN PROGRESS ON:
  32. 52.
  33. 53.
  34. 54.

    TASK: CREATE A WIREFRAME / SKETCH FOR RANKING FILM. DESKTOP

    VER. ONLY Ranking Films is a website that allow multiple users to vote or arrange their own list and add them on their favorites.
  35. 55.

    PERSONAS The applications will mainly be used by Movie Reviewers,

    Movie Enthusiasts and General Public. Below is brief description. Movie Reviewers – Throw comments, discuss movies with his technical background. Can create list, view and share list. Movie Enthusiasts – View/Create list, share and edit list and upvote movie General User — Upvote, Watch movies, create and edit list and can share list.
  36. 56.

    ASSUMPTIONS The application should have a simple interface. The customer

    puts minimalism and simplicity on the ground that it will be used ANYWHERE in the world. Application consists of modules that the user can switch. These modules are: Top movies, List of 2017, Top Movies of 2017 and Ranking by Votes
  37. 57.

    AS A DESIGNER As a designer, you have the freedom

    to add colors you want, fonts or shapes. The general layout and logic of the application should be preserved. The customer wants to use his brandy blue in the project: #0066FC.
  38. 60.
  39. 62.

    References TRAINSIMPLE (2017) Wordpress 3.X fundamentals. Retrieved from http://www.trainsimple.com EWER,

    T. (2012) The 5 key fundamentals of wordpress site design. Retrieved from https://managewp.com MARSH, J. (2014) UX crashed course: 31 fundamentals. Retrieved from http://thehipperelement.com KURTULDU, M. (2017) Basics of UX. Retrieved from https://developers.google.com DANCE, J. (2014) 7 UI/UX Principles to help create a fresh experience. Retrieved from https://www.freshconsulting.com JAKUB & VLAD LINOWSKI INTERACTION DESIGN (n.d) A Good User Interface. Retrieved from http://www.goodui.org/ BEGINNER'S GUIDE FOR WORDPRESS / Start your WordPress Blog in minutes (n.d) Retrieved from http://www.wpbeginner.com/