24

E-Site DESIGN

Embed Size (px)

Citation preview

Page 1: E-Site DESIGN
Page 2: E-Site DESIGN

E-SITE DESIGNHow your business-site could attract people to keep their eyes on it and interfere their behaviour upon your brand or product deeply.

Page 3: E-Site DESIGN

IS IT A MUST, WEBSITE?* 24/7, 350 days a year* Professional image* Simple cheap store (Information, sell products)

* Presenting your brand to global market and unpredictable audience

* More than 20 shoppers are browsing online (It’s about easiness)

Page 4: E-Site DESIGN

CRUCIAL THINGS ON WEBSITE

• Accessibility : able to be opened?

• Usability : effectiveness, efficiency

and satisfaction• Information architecture : navigation

• Visual design : harmonization

• Web analytics : identify the goal’s

achieving• SEO optimization • Priority : Emphasizing precious points.

Page 5: E-Site DESIGN

E-SITE HELPS

CONSUMER TO?

• Buy their needs rapidly

• Find information in order

to decide option before

purchasing

• Save the money and time

• Interact with the company

• Enjoy a better web-

experiences

Page 6: E-Site DESIGN

ANALYTIC IS NEEDEDTO MEASURE MARKETER

OBJECTIVES

• Consumer Acquisition

• Consumer Retention

• Consumer Extension

Page 7: E-Site DESIGN

Achieving The Objectives:

• Content

• Ease To Use

• Quick To Download/Use

• Frequently Updated

Page 8: E-Site DESIGN

Online Value Proposition (OVP)

• Find a proposition that explains what

your organization web site should offer:

- the differences from your competitors

- something that is not available in the

real world

- making a difference to your customers’

live

Page 9: E-Site DESIGN

What next after having the proposition?

• We need to leverage the

proposition in traffic building

• State clearly the proposition

on-site

• Deliver on the proposition

through all interactions

Page 10: E-Site DESIGN

Rosenfeld and Morville (2002) : Four stages of research which help achieve

customer orientation

• Identify different audiences• Rank importance of each to business

• List the three most important

information needs of audience• Ask representative of each audience type to develop their own wish lists

Page 11: E-Site DESIGN

Dynamic design and personalization

Personalization helps to :• Sell – make it easier for customers to select the products

• Serve - make the service • Speak – customer can select the type of communications they want to receive

• Sizzle – add value, strengthen the brand, and develop the relationship

Page 12: E-Site DESIGN

Options for Personalization

• Customer or company name

• Date or time

• Country

• Customers preferences

• Recommendation algorithms

Page 13: E-Site DESIGN

• Aesthetics = graphics + color + style + layout and typography

• Site personality: formal, fun, engaging, hiburan, professional, ataupun serius

Page 14: E-Site DESIGN

Site style

• Information-intensive siteBanyak text , dengan tujuan mempergunakan space tersebut secara maksimal dan menayangkan informasi-informasi yang dalam dan bernilai bagi pengunjungnya.

• Graphics-intensive siteSedikit text, namun memperbanyak grafis dan juga animasi yang digunakan untuk menimbulkan impression.

Page 15: E-Site DESIGN

Halangan dalam mendesain site

Terkait dengan:1.Modem and download time2.Screem resolution fluid design =desainnya memaksimalkan space

yang ada di layar monitor, menyesuaikan dengan screen resolution di atasnya

fixed design3.Number of colour4.Browser5.Plug-in and download time6.Font size,7.Platform

Page 16: E-Site DESIGN

Visual desain• Desain yang baik First impression yang baik membangun kepercayaan dan juga menentukan tone untuk future experience.

• keseimbangan desain visual dan juga tingkat accessibility, usability, persuasi dan juga branding.

Page 17: E-Site DESIGN

Color• Pemilihan warna harus tepat secara :1.personality dari target audience2.colour scheme yang sesuai dengan brandnya3.usability dan juga accessibility.• Setiap warna memiliki temperature-nya masing-masing

• Setiap warna juga memiliki arti yang berbeda atau sebagai suatu symbol.

• Background lebih cenderung diisi oleh warna-warna contras, sedangkan menggunakan tinted boxes sangat bermanfaat untuk meng-highlite content yang ingin kita tekankan kepada visitors untuk dibuka.

Page 18: E-Site DESIGN

Typografi• gunakan typografi yang konsisten ke seluruh bagian site.

• Batasi penggunaan tipe font dan juga ukuran yang berbeda.

• Penggunaan font san-serif sangat cocok untuk web, karena terlihat lebih tajam pada layar.

• penggunaan left justified untuk body text sangat cocok untuk website.

• Penggunaan judul atau headline usahakan jangan menggunakan gambar. Karena akan menghalangi search-enggine untuk menemukannya.

Page 19: E-Site DESIGN

…..Typography

• Jangan menggunakan underline body text,

example: hikayat pengembara

karena dapat dikira sebagai hyperlink oleh

pengunjung site tersebut.

• Gunakan standard untuk penulisan capital

headline dan juga link text:

Amazing new product released dianggap lebih

baik dari Amazing New Product Released

• Hindari penggunaan huruf italics karena sulit

di baca

Page 20: E-Site DESIGN

Page design• Nama dan juga logo perusahaan harus

terhubung ke homepage bila di klik.

• Ada menu serta sub-menu sebagai

navigasi.

• Ada footer di bagian bawah halaman

page, sebagai referensi untuk

copyright dan juga informasi privasi.

• Page title for content

Page 21: E-Site DESIGN

Copywriting

• Ahli komunikasi dari Amerika Serikat, Frank Jefkins, mengartikan copywriting sebagai seni penulisan pesan penjualan yang paling persuasif dan kuat.

• Seorang copywriting disebut dengan copywriter.

• Syarat utama menjadi copywriter adalah penguasaan bahasa

• CRABS (Chunky, Relevant, Accurate, Brief, Scannable)

Page 22: E-Site DESIGN

Navigation and Structure• Ease of use = structure +navigation+ page layout + interaction

• three navigation rules for a navigation template :

1.Keep it simple2.Be consistent3.Signposts• Types of navigation :1.Global navigation2.Local navigation3.Contextual navigation4.Breadcrumbs

Page 23: E-Site DESIGN

Interaction

• Interaction and two-way communications can help move customer through several stages of the buying process :

1.Learning2.Deciding3.Buying4.After-sales support

Page 24: E-Site DESIGN

SMOOCH :*