| COMPANY: | CA for NCI |
| TEAM: | Myself |
| MY ROLE: | UX Researcher, UX Designer, Visual Designer, Developer |
| TOOLS: | Google Docs, OmniGraffle, Sketch, WebStorm, ScreenFlow, Photoshop |
| CODE: | PhoneGap, jQuery Mobile, localStorage, HTML/CSS, JavaScript |
| TIME: | Mar – May 2015 |
Heuristic Evaluation + Usability Testing + UX Analysis + Recommendations
THE BRIEF
It doesn’t really matter if hand-made trend is still ongoing or it declines. Whatever the truth is, still a lot of people decides to make money in such a way. The main reason for this, is relatively low cost to entry craft business and high prices of the finished goods.
Formerly craft was associated with buying at fairs and festivals, or directly at the house of the artisan, where housewives did an embroidery and men carved holy figures in wood. Often these products were connected with the history of the region.
Today the craft is treated more broadly. Many hand-made goods we can buy through the online auctions, there is a lot of blogs and e-shops created by the artists. We can find almost everything from jewellery, embroidery and greeting cards to the wrought-iron and homemade pastries. This is an opportunity for hundreds of people for own business and earnings. The largest competition is in the handmade jewellery segment, but still a lot of people enters this market.
One of the most popular online market places for jewelry artists and artisans is Etsy. It has over 6.7 million products listed for sale, half of which fall into just three categories: jewellery, art supplies, and vintage. Jewellery alone, with 1.5 million listings, accounts for nearly 25% of all of Etsy’s products. Etsy has sellers in over 150 countries.
KEY CHALLENGES
Making handcrafted items for sale can be very rewarding but it can also be quite difficult to work out what to charge for the creations. Some applications on the market try to address these issues, but usually, they don’t meet all the requirements.
The new design of GreenOnyx, the rich client-side mobile application will help jewellery artists and hobbyists to price their products and keep catalogue of their works always ready to show to the potential customers. The application will be a combination of pricing calculator and portfolio / product catalogue.
With GreenOnyx users simply enter the cost of the materials and labour time. There are also general settings like targeted annual income and price markups. The app will then show the user how much he should be charging to break even or make a profit. The user is also able to take a photo of a jewellery piece with the device camera. The products with pictures and calculated prices are stored as a catalogue and can be shown to the potential customers, whenever required. The app supports multiple currencies and automatically uses the default currency set on the device.
THE SOLUTION
COMPETITIVE ANALYSIS
There are several similar applications on the market. They differ in many respects by functionality, user interface, technology, platform and price. Some apps have poor visual style and they are not designed according to the latest mobile presentations patterns. Some of them lack useful features. Free apps are full of ads, which negatively affect user experience.
https://play.google.com/store/apps/details?id=co.uk.handmadeaberdeenshire.craftpricingcalculator&hl=en
The app will then show you how much each item cost to make and what you should be charging to break even or make a profit. It lacks product catalogue functionality. User cant’s set annual income.
http://www.bejeweledsoftware.com/
This is very good inventory management program for jewellery artists and beading hobbyists. It is a Microsoft Access runtime. Probably most advanced in terms of functionality from all similar applications on the market. It generates reports, catalogs and price lists, keeps track of inventory, sales, it helps to price jewellery pieces. It is developed for
http://beadiadotnet.blogspot.ie/
Currently the only native Mac OS X application on the market. It is a management app designed to assist the jewellery designers to manage their sales, stock, parts and customers. The idea is great, but the app is buggy and not supported anymore. It doesn’t work with the latest Mac OS X system.
The Valigara app has a great feature – it has eBay and Etsy integration and helps to unify stock between all marketplaces. It is an extensive online catalog system. We can’t use this application offline and monthly fees are quite expensive.
Presented programs are great business tools, however there is still some room for improvement. The proposed app will address the following issues:
- Pricing, cataloging, capturing images of work in one app which can be carried anywhere and presented to the potential customers.
- Existing software solutions are usually too complex – users have to fill in a lot of unnecessary fields which makes a task very time consuming.
- It’s hard to find an application with a pricing feature or it’s very limited.
- Available applications are way out of the price range of a small, one-person business or hobbyist.
- Multiple platforms.
DESIGN
MOODBOARD
MAIN FEATURES
- Calculating the exact hourly rate an artist should be charging.
- Generating wholesale, direct and retail price.
- Capturing images of products
- Social media sharing
- Products catalog
MOBILE FLOW
The main screens of the app are Home, Settings and Catalog Screen. User can access them via navigation bar at the bottom of the screen.
On the Home Screen user can add jewellery piece details, raw materials cost and labor time and capture a photo with a device camera. The app will generate prices based on entered data. Saved items will be displayed in the table below the input form.
The Settings Screen contains collapsible list. User can change there general settings like price markups, overheads , indirect costs, annual income, working hours. These settings are required to calculate prices. Button ‘Clear All Pieces’ removes all entries from the application.
The Gallery Screen contains list with four jewellery categories. The product catalog / gallery functionality will be added at the later stage. It will help the user to present their work to the potential customers.
The ‘About’ link at the top of the page opens a dialog window with app details.
DEVELOPMENT
HYBRID APP
The GreenOnyx will be developed as a hybrid mobile app using PhoneGap and it will be written in HTML, CSS and JavaScript. The hybrid apps give a short cut to deploy web apps as native apps by wrapping the web app code using a native framework such as PhoneGap. The distinct advantage the hybrid option gives is the reduction of development cost and time for rolling out apps for various mobile platforms using the same skill sets required for web application development. Wrapper technology frameworks which are available for most popular mobile platforms also expose some platform specific features, thus making them richer than pure web apps.
The jQuery Mobile is a user interface system for mobile devices that works uniformly across different platforms, such as Android and iOS. While jQuery Mobile mainly focuses on the uniformity of the user interface in a web application paradigm, the PhoneGap framework allows developing HTML5 and JavaScript based native applications that can be deployed on multiple mobile platforms including Android and iOS. Those frameworks can be used together to develop native applications where the user interface is built via jQuery Mobile and native device functions are constructed using PhoneGap.
WHY jQuery Mobile and PhoneGap:
- With jQuery Mobile, you would develop the user interface based on the jQuery Mobile user interface system using HTML5, CSS, and JavaScript. The user interface will have the same look and feel and will support a uniform event handling model across different platforms.
- Similarly, for accessing native device features, you would code in JavaScript utilising the PhoneGap device API. There is no need to code against device specific APIs. Across different platforms, the application will function uniformly.
- Since you do not have to use platform specific user interface and programming models, you can develop and deploy your applications faster.
- Both jQuery Mobile and PhoneGap are open source technologies.
WHY PhoneGap:
- The proposed app is quite simple and the native feel isn’t that important.
- Reuse of HTML and JavaScript skill set.
- Need to deploy to multiple devices.
- App store benefits
- Offline data
- Cross platform
- Camera access
Cordova ships with a minimal set of APIs, and projects add what extra APIs they require through plugins. GreenOnyx APIs:
- Camera – Capture a photo of the product using the device’s camera.
- Device – Gather device specific information – currency
- FileSystem – Hook into native file system through JavaScript to access images
- Splashscreen – Show and hide the application’s splash screen.
jQuery Mobile Page Structure:
A single HTML file in the jQuery Mobile framework consists of one container page with one or more content pages inside the container. The container page has a data-role=”page” attribute, whereas the content pages have a data-role=”content” attribute. A content page can optionally have both a header and a footer. The GreenOnyx app has one container page and the following content pages with both header and footer: home, detail, add, edit, list_category, list_all, settings. There is also ‘about’ dialog window. Within a container page, it is intended to display only one content page at a time. The idea is to group logically related screens together inside a single container page and define each of those as a content page. For example, those content pages may share common JavaScript code.
localStorage
For data storage we were using localStorage. Other options which were considered were SQlite, WebSQL and IndexedDB databases. The main reason to choose client side storage, was the possibility of accessing the app when the user is offline, possibly sync’ing data back once the network is connected again (future prospect).
Secondly, was a performance booster; we can show a large amount of data as soon as the user opens an app, instead of waiting for it to download again.
Thirdly, it’s an easier programming model, with no server infrastructure required. LocalStorage: “Also known as web storage, simple storage, or by its alternate session storage interface, this API provides synchronous key/value pair storage, and is available in underlying WebView implementations. “
FUTURE PROSPECTS
- Synchronising with Server Server synchronisation for desktop app is another good direction to go. One central database would make possible accessing data from many different devices.
- Developing a plugin for a direct listing of pieces in the Etsy shop. Etsy is one of the biggest online market places for the art and craft people. It also supports developers and various useful plugins are available. Developing an Etsy plugin for listing products directly from the app is a great idea.
- CMS Prestashop integration. The next step could be support for other online shops like eBay or CMSs like Prestashop, so the users could avoid headaches with listing same goods in several e-shops and tracking the sales.
- SQlite database with inventory items, raw materials calculation.
- Suppliers list
- Advertising
- Sharing on Pinterest and Facebook.
- Sending Catalog to printer and via email.
- iOS version.
- Adapting an app for other craft people not only jewellery artists but also multidisciplinary artists.
Getting a translation quote, booking an interpreter and making one-off online payments, registering as an interpreter.
An interactive game to motivate you for sports and bring out your inner hero.