Third week slides of eMarketing Course at Hacettepe University taught by Ayca Turhan Topics covered within the presentation include:
Digital Assets, Websites, Mobile Websites, Mobile Apps
User Experience
Testing
For more please visit: www.aycaturhan.com/man423
8. Today’s Topics
• User Experience Design
• Web Development and Design
• Writing for Digital
9. Digital Marketer’s Role
• Even though digital marketers don’t
have to be the one who designs and
develops digital assets, they must have
the skills to manage them and be a
part of the process.
• A digital marketer has to be tech-
savvy.
11. User Experience
• User experience (UX) is the overall
satisfaction a user gets from
interacting with a product or digital
tool.
12. User Experience Design
• The process of creating remarkable,
user-friendly and effective digital
assets.
• It is closely related with:
– Strategy and Research
– Web Development and Design
– SEO (Search Engine Optimization)
– Content Strategy and Creation
– Conversion Optimization
13. User Interface
• It is is the user-facing part of the tool or
platform.
• It is the part of the actual website,
application or tool that the user
interacts with.
15. Core Principles of UX Design
• User Centric Design
• Usability
• Simplicity
• Credibility
16. User Centric Design
• Who is the user?
• What are the user’s wants and needs
from your platform?
• Why is the user really coming to your
website?
• What are the user’s capabilities, web
skills and available technology?
• What features would make the user’s
experience easier and better?
17.
18. Usability
• Usability means how user friendly,
efficient and slick the digital product is.
• Sticking to standards is important:
– Navigation menus at the top or left of the
web page
– The logo in the top left hand corner, which is
linked to take the user back to the home
page
– Search boxes placed at the top of the page,
using standard wording such as ‘search’, or a
magnifying glass icon.
19.
20. Simplicity
• Get rid of features and elements that
your users simply don’t need, and
focus on the core user experience.
21. Credibility
• If your digital assets don’t look credible
enough, people may not want to be a
part of the experience.
– Looks
– «About us» part
– Logos
– Content
– No spelling errors
22. Mobile UX
• Types of Mobile Assets:
– Mobile websites:
• m.facebook.com
• m.9gag.com
– Mobile applications
• Angry Birds
• Instagram
– Responsive Websites
• thenextweb.com
23. Mobile UX
• Limitations:
– Small screens
– Difficult inputs
– Slow connection speeds
– Slow hardware
• Mobile First: Create mobile experience
first, adopt it to web later
24. Mobile UX – What to do?
• Simplify
• Reduce loading time
• Encourage exploration
• Give feedback
• Communicate consistently
• Predict what user wants
25. Step By Step Guide To UX Design
• Conduct Research and Discovery
• Analyse Content
• Create the site’s basic structure
• Create a sitemap
• Build the navigation
• Create the layout
• Assemble other elements
• Define the visual design
• Conduct testing
27. Analyse The Content
• Do a content audit for existing sites
• Create a content strategy for a new
site
28. Create Site’s Basic Structure
• Information architecture (IA) is about
managing information – taking a lot of
raw data and applying tools and
techniques to it to make it manageable
and usable.
• Information architecture is crucial for
usability
• Categories and pages should be from
broad to narrow in a hierarchical
structure
37. Wireframes & Prototypes
• Wireframes are the skeletal outlines of
the layout of a web page.
• Prototypes are a step up from
wireframes, in that they are interactive.
39. Other Elements
• Search: Many sites can benefit from
having a search function, both to help
users navigate and to make finding
specific information easier.
44. Testing
• The purpose of this is to discover
problems and gain insights that can be
used to improve the final product.
45. Testing Process
• Formulate a question to test
• Choose a test and prepare
– User-testing methodologies
• Hallway testing
• Observation and user labs
• Split testing and multivariate testing
• Eye tracking
• Surveys
• Find subjects
• Test
• Analyse
• Report
• Implement
• Start Again
46. A/B Testing
• A/B testing (also known as split testing)
is a method of comparing two versions
of a webpage against each other to
determine which one performs better.
https://www.optimizely.com/ab-testing/
48. A/B Testing
• It’s an amazing method for finding out
the best method that works!
• It can be used to test:
– Site elements
– Ads
– E-Mail campaigns
– Anything you can think of in Digital
Marketing
49. A/B Testing Process
• A/B testing is a process and it can be
done multiple times before a final
decision is made.
• Tests must be run simultaneously.
• Testing must continue until statistically
significant results are available.
52. Web Development & Design
• You can apply web development and
design principles websites and other
digital assets as well.
HTML5
PHP
CSS3
AJAX
Colors APIs
User
Elements
Javascri
pt
Images
Brand Photosho
p
53. Web Design
• Web design is the process of creating
all the visual aspects of the interface.
– Layout
– Colour scheme
– Images
– Logos
– Design elements (such as buttons and
links)
– Anything else that you can see.
54. Web Design
• There is a close relationship between
UX and visual design.
• Digital properties shouldn’t be just
beautiful, they also need to create a
good experience for the users.
55. Web Development
• Web development is the process of
taking finished web designs and
transforming them into fully
functioning, interactive websites.
• Three decisions that must be made:
– Static webpage or usage of CMS
(Content Management System)
– Server-side language?
– Front-end language?
56. Static Site vs. CMS
• On a static site, content can be
added by a web developer.
• A CMS can be used to manage the
content of a website. Today, many
sites are built on a CMS.
• Widely-used CMS solutions:
– Wordpress
– Joomla
– Drupal
57. Languages
• Server Side Languages:
– PHP, Java, Ruby, etc.
• Front-End Languages:
– HTML, CSS, JavaScript, etc.
58. Mobile Development
• Mobile websites:
– m.facebook.com
– m.9gag.com
• Responsive Websites
– thenextweb.com
• Mobile applications
– Angry Birds
– Instagram
60. Writing For Digital
• Online copywriting includes:
– Text content on a website
– Subject of an e-mail
– Text content of a Call-To-Action button
– Text content of ads
– Social media posts
– And more...
61. Writing For Digital
• Online copy must:
– Provide information to users
– Engage with them
– Convince them to take desired action
– Convey brand ethos
– Provide context and relevance to search
engines
62. Before Writing:
• Who is your audience?
• Which information do they need from
you?
• What do you want them to do?
63. Types of Web Copy
• Short Copy
– Limited time and space
– ie. Banner ads
• Long Copy
– Longer pieces of content
– ie. PR report
64. Call-to-action
• A descriptive instruction that explicitly
tells a reader what to do.
– Buy now
– Click here
– Try for free
– Download now
– Sign-up now
68. Social
• Do research
• Write shareable content
• Avoid overly promotional content
• Have a communication protocol
69. Long Copy
• News releases
• Articles for online syndication
• E-mails
• Blog Posts
• Advertorials
• Website
70. Your Content Has To Be:
• Clear and concise
• Easy to read
• Well-written
• Well-structured
71. SEO Copywriting
• A good copywriter must be familiar
with SEO.
• Audience & Search Engines
72. Contact Me
• e-mail: ayca.turhan@hacettepe.edu.tr
• Course Page:
www.aycaturhan.com/man423
73. Sources
• emarketing: The Essential Guide To
Marketing In a Digital World 5 Ed.» by
Rob Stokes and and Minds of Quirk
which is available at:
http://www.quirk.biz/emarketingtextbo
ok/