+ All Categories
Home > Documents > Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment...

Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment...

Date post: 04-Jul-2020
Category:
Upload: others
View: 2 times
Download: 0 times
Share this document with a friend
23
Tarbiyah Books Plus Case Study Creative Director & Lead UX January 2016 Aisha Aliyu Website: https://aishaaliyu.com Mobile: +44 7595 901 356 Email: [email protected] LinkedIn: https://uk.linkedin.com/in/aishaaliyu Industry Specialist Online/Offline Retail Components Branding Design for Print & Interaction User Research Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design
Transcript
Page 1: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus

Case Study

Creative Director & Lead UX

January 2016 Aisha Aliyu

Website: https://aishaaliyu.com Mobile: +44 7595 901 356

Email: [email protected] LinkedIn: https://uk.linkedin.com/in/aishaaliyu

Industry

Specialist Online/Offline Retail

Components Branding

Design for Print & Interaction User Research

Interaction Design Localisation

E-Commerce Deployment Gamification

Mobile App Design

Page 2: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Table of Content

Introduction - The Client 3 Stakeholder Objectives 3

The Briefs 4 Branding 4

Solution 4 Results 5

Social Media 6 Solution 6 Results 6

Web Design & Development 7 Challenges 7

Hofstede says what? 7

Process 8 Competitor Analysis 8 Interviews 9 Surveys 9 Metrics 9 SITE MAP/TAXONOMY 9 Search Engine Optimisation 11 Web Optimisation 11

Outcomes - Personas 13 HAJARA BABAGANA 13 User Stories 14

Web Redesign & Testing 14 Website 14 5 second test 15 User Testing 15

Implementations 16 Screenshot & Website URL 19

Mobile App Design - Ongoing 20 Wireframes (Axure RP Pro & Adobe Illustrator CC) 20 Next Steps 21

Instore Experience 22 Profile 23

Page 3: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Introduction - The Client Established in 2012 in Abuja, Nigeria, Tarbiyah Books Plus (TBP) is a brick & mortar and online supplier of books, CDs, DVDs, electronics & learning aids. TBP is the one stop shop for Islamic books and products, carrying an inventory of over 50,000 products. Borne out of opportunity (size of the market, growing population and rising affluence) and the need to counter the negative attitudes towards Islam, the company’s main goal is to educate muslims and non-muslims alike on all the positives and progressive ways of Islam. Adhering to both company and islamic principles such as honesty, integrity, tolerance and goodwill towards all, TBP achieves this by delivering the widest variety of products at extremely competitive prices with the best customer service and support. To fully succeed, Tarbiyah Books Plus needed to establish it’s online and offline presence and offerings, engaging customers at every touch point. To that end, I have been given the mandate to build, innovate and create technologies, products and strategies that is exciting and meets and exceeds customer expectations and experience.

Stakeholder Objectives By talking to and interviewing key stakeholders, I was able to generate the following main

objectives.

CUSTOMERS TARBIYAH BOOKS PLUS

• Provide a large variety of products and services • Generate sales and increase revenue

• Provide savings and offers • Drive traffic (online and in-store)

• Facilitate discovery of new products • Build user relationships & loyalty (stickiness and retention)

• Anticipate and respond to user needs, wishes and wants

• Create personalised and unique experiences across all touch points

• Invest and promote on social networks • Collect customer data

• Make TBP accessible on all devices (cross-platform)

• Increase competitive advantage by creating the perception that TBP is innovative, forward thinking and diminish competitors’ perceived advantage.

• Provide personalised and unique experiences online and in-store

• Enhance B2B relationships

• Access products online and offline • Reach target market and beyond

• Secure, convenient and easy to use • Enter additional international markets

• Create new revenue streams

• Build, maintain and foster positive relationships with vendors, suppliers and contractors

• Implement a cross-channel strategy

Page 4: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

The Briefs Serving as the Acquisitions and Creative Director since 2012, I have been working on multiple aspects of the business and roles ranging from Acquisitions & Procument, Chief Technology Officer (CTO), Lead UX Designer, Creative Director and also Marketing Managing to name a few. As such, the scope and length of project types vary. The following section breaks down relevant briefs and projects as the Creative Director, CTO and Lead UX Designer.

Branding Working directly with the CEO, I was tasked with coming up with a suitable name and creating a brand inline with companies goals of honesty, integrity, tolerance, education and goodwill towards all, whilst adhering to islamic guidelines with a focus on a world-view and not alienating non-muslim customers. Branding and marketing an Islamic business is not that different from branding generally. The focus is essentially based on a strong sense of community and welfare is to underpin all activity informing business ethics.

Solution This was my first foray into Islamic branding and marketing, so the first thing I did was to research this topic. Upon completing the research, I was able to create a design brief to establish the target market, audience, tone and voice of brand, company goals, value proposition, and competition. After interviewing the CEO and board of directors, I was able to come up with a holistic picture of the business. With this information, I was able to come up with a name and brand, inline with the companies goals. The word Tarbiyah was selected as it is the arabic word meaning education and upbringing. The books, signifies the main products to be supplied, and the plus for the companies other offerings. During the stakeholder interviews, the subject of expansion and possible pivoting arose, so it was important to take this into consideration, so the plus was added. This was presented to focus groups and stakeholders who overwhelmingly approved of the choice of name. Thus, Tarbiyah Books Plus was borne. The next step was to design the logo and the collateral. A relatively straightforward process, semiotics and iconography used had islamic significance. For example, the choice of colour green. In Islam, green is said to be the favourite colour of the Prophet. So two shades of green where used. As for the icon, it was inspired by imagery found within islamic art all over the world.

“a strong sense of community and welfare is to underpin all activity informing business ethics.”

Page 5: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Results

Branding for Tarbiyah Books Plus.

Page 6: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Social Media The benefits of social media are countless. The board of TBP were in agreement, so I endeavoured to utilise social networks to achieve the various objectives of creating visibility, brand awareness, customer data collection, expanding audience, sharing content faster and easier, lead generations at low costs and creating meaningful relationships with our customers.

Solution To date, Tarbiyah Books Plus is present on all major social networks including Facebook, Twitter, Instagram, Google Plus and Nigerian directories with significant followers.

Results There is a direct correlation with the number of in-store sales and social media postings, especially on Instagram.

“We need to be everywhere, facebook, google, instagram…”

Page 7: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Web Design & Development The challenge was to come up with an easy to use and user friendly e-commerce website inline with the brand and one that also differentiated it from its competitors. Considerations were also to be given to web optimisation (speed), security and search engine optimisation. The company had no web presence so a catalog based responsive website using a generic magento template was used in tandem with Google analytics to start collecting customer data. This was then followed promotion of the store on social media to encourage store visits and also to view products onlines.

Challenges HOFSTEDE SAYS WHAT? Nigeria presents a different set of challenges for eCommerce and businesses in general. Even Hofstede’s cultural dimensions fall short especially on uncertainty avoidance as research revealed. It has the largest mobile market in Africa surpassing the desktop as the main tool for internet access. It also has a varied mobile eco-system in comparison to Europe. For

“I want them to access our website everywhere [all devices].”

Page 8: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

example, Blackberry still has considerable presence and smartphone owners also own feature phones. This is also evidenced from the company google analytics data showing Android, iOS, Blackberry and windows devices being used to access the site. Research revealed the following pain points when it comes to electronic and mobile commerce.

Process COMPETITOR ANALYSIS

Competitors were selected based on the similarity of their product offerings and location (all within Nigeria). Their websites and the TBP website were audited using metrics such as ecommerce functionality, social media presence and marketing efforts, site organisation, layout and design, browsing, navigation, labelling, taxonomy, speed, search functionality (ability to search by categories, titles, ability to sort, relevancy etc), wishlist functionality, ability to check out without registering and product range.

23%

21%

18%

18%

15% 6%

Security & Distrust Network issues and Poor QoS Internet & Site Speed Prefer to shop offlineLack of payment options No Mobile Version of Sites

1

2

2

3

4Tarbiyah (TBP) Iqra Baytuzzeenah

Page 9: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

TBP Scored the highest at 23/30, with the others scoring 14/30 and 11/30 (see figure below). This puts the company at a very good starting point by allowing it to capitalise on its competitors failures and deficiencies. INTERVIEWS Current customers, perspective customers and other stakeholders where interviewed to unearth their needs, goals, behaviours, device ownership, demographic data, device usage, education levels, attitudes to technology and online shopping. SURVEYS To reach a wider audience, online surveys where undertaken to gather more information as with the interviews using survey monkey and google sheets. METRICS Additional information was sourced from sales records, the marketing team, data from Facebook

and Google Analytics.

SITE MAP/TAXONOMY Using product inventory data a site map was created to ensure customers could effectively and efficiently find products and information. To further aid with the categories of products, Islamic taxonomies together with their English translations were used for further clarity, for example, Afterlife/Akhira, Aqidah/Belief etc

3: Excellent • 2: Average • 1: Poor • 0: None

Page 10: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Page 11: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

SEARCH ENGINE OPTIMISATION Key SEO strategies were implemented into the Tarbiyah Book Plus catalogue website, as such it appears on the first page of search engines (Google, Yahoo!, Bing) for terms such as “Islamic book shop nigeria”, “islamic book shop abuja”, “islam book abuja” and other variations for islamic products in Nigeria.

WEB OPTIMISATION As one of the key pain points users raised was speed. It was important to ensure that site performance was satisfactory. As such Google webmaster tools and caching tools are currently used to find and resolve issues.

Page 12: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Page 13: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Outcomes - Personas With all the information collated and analysed. A number of personas were created to represent our core customers. A sample can be seen below based on a mother who frequently buys items for her children. HAJARA BABAGANA

Others included our male customers, corporate buyers who request special product offerings and also organisations school as such schools and mosques. For example, during religious holidays and events, such as Ramadan or Eid, clients often request an average of about 30 hampers that include our best-sellers, health oils, Qur’ans, prayer accessories and more.

Page 14: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

USER STORIES

User Stories Successful Actions

As a customer I want to be able to search for products by name so that I can see products matching my search

Search is visible and displays required information Search can be sorted (relevancy, cost etc)

As a customer I want to select a product to view its details

Product page is displayed with image, name, price, stock availability etc

As a customer I want to quickly add products to my shopping basket

Add to Cart button present on pages not only on the product page

As a customer I would like to view product reviews before I buy

Include ratings on products and reviews (gamification)

As a customer I want to know my details and information are secure

Information disclosure page, SSL certificate image, FAQs

As a customer I want to have the latest information on products, services and offers.

Newsletter sign-up

As a customer I want to find out about discounts Items on sale clearly displayed

As a customer I want to be able to access the website on my mobile phone or tablet

Responsive design

As a customer I want to shop quickly without registering

Guest checkout with account creation after completed purchase. Register with a social network account.

As a customer I want to be able to share products Share pages and products via social networks

As a customer I want to find out the cost of delivery and the options available

Delivery information page Cost of Delivery at Checkout

Web Redesign & Testing WEBSITE Based on all the findings, a new ecommerce enabled website was implemented, migrating from magento to wordpress & woocommerce. Due to budget and time restrictions, the company opted to use a template and customise as needed. The site featured a responsive design with a unified look and feel throughout the UI. This streamlining of the graphic style was to ensure the UI seemed professional and trustworthy. In addition, the website was to meet the goals of the customers and the company. As such the website should: • Address user pain points of security, distrust, speed etc • Be responsive and accessible on a number of devices and various operating systems. • Have a unified look and feel throughout the UI, to ensure it seemed professional and trustworthy. • Value propositions to be clear and consistent • Should take advantage of competitor deficiencies such as poor search, labelling, navigation etc

Page 15: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

5 SECOND TEST With little customisation to the new website, a number of tests were undertaken to further unearth areas of improvement and possible added functionality. 5 Second tests were undertaken on a variation of homepages, with the homepage on the right being the most striking. Users responded positively to the use of grids as opposed to a sliding banner. USER TESTING In-situ and remote testing was then undertaken on the site. The tests were based around trying to buy products, searching for items, and registering for an account. Whilst the overall design, look and feel was to the liking of users, the tests revealed some key problems. Some of the problems include: The tests revealed a number of issues. • Add to cart button not being obvious • No dedicated delivery information page • No visible contact information • No payment options visible • No product ratings and reviews • No information about security • Loading of the site was slow • No clear value proposition • No wishlist or ways to save products to view later • No FAQs Page

Page 16: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Implementations Based on the findings from the user tests the following was implemented to the site. In addition, other eCommerce UX strategies for a better experience were also implemented.

Issue: No dedicated delivery information page

Solution: Delivery information in top menu, footer and dedicated delivery

information page including pricing and delivery times

Issue: No visible payment options and information about security page

Solution: Visible payment options and implementation of a sitewide SSL with

seal which can be clicked and validated.

Issue: No product ratings and reviews Issue: Non visible add to cart buttons

Solution: Product ratings and reviews together with verified

purchasers and user profile image. Solution: Clearly visible add to cart buttons on all pages.

Page 17: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Issue: No clear value proposition

Solution: Clear proposition on the home page together with guarantees.

Registration Options including Facebook Wishlist functionality to save, view and share products at anytime

Page 18: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Checkout without registering to increase conversion

Page 19: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Screenshot & Website URL You can visit the website at https://www.tarbiyahbooksplus.com

Page 20: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Mobile App Design - Ongoing As part of the cross-channel strategy, Tarbiyah Books Plus wants to create an app, starting with an Android version with iOS, Blackberry and Windows versions to follow. In line with stakeholder objectives, the app is to generate additional sales, enhance the customer experience, create stickiness and retention, and also increase competitive advantage by creating the perception that TBP is innovative, forward thinking and diminish competitors’ perceived advantage. This guide showed the directors that a consistent UI had been established and the end user would be holding a unified and slick experience.

Wireframes (Axure RP Pro & Adobe Illustrator CC)

Page 21: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Next Steps A prototype of the app is currently being developed. Once it is completed it will be tested to ensure it gives users the best experience. It wil be launched on Google play and other operating systems will follow.

Page 22: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Instore Experience With the advent of wearables and innovative technology such as Apple’s iBeacon, ApplePay, Samsung Proximity to name a few, a large opportunity exists to enhance customers experience by sending them relevant, real-time and personalised content and benefits. I have been given a mandate to discover what technologies we can use in the future to enhance overall experience. From QR Codes, Sensors, Try me models and more, I am in the process of discovering and doing feasibility studies. Tarbiyah Books Plus will indeed be innovative, so stay tuned!

“deliver real-time and personalised in-store offers to shoppers.”

Page 23: Tarbiyah Books Plus - Aisha Aliyu...Interaction Design Localisation E-Commerce Deployment Gamification Mobile App Design . Tarbiyah Books Plus Case Study 2016 ... magento template

Tarbiyah Books Plus Case Study 2016 https://aishaaliyu.com

Contact

Email: [email protected]

Mobile: +44 7595 901 356

Website: https://aishaaliyu.com

LinkedIn: https://uk.linkedin.com/in/aishaaliyu


Recommended