Artefact 6 - Evaluation

The final artefact looked into redeployed websites onto an Android and iPhone device and whether they enhance/hinder their experience. The answers consisted of the following sections to outline their experiences; presentation, navigation, accessibility, content, clarity and speed.

The design and structure were built upon from artefact 5, where I tested the app for potential errors and faults. The app was built using Flash CS5.5. This incorporated actionscript 3 and consisted of new elements added in from the previous feedback. The application was published using Air for Android and Iphone with 2.6 supports in Flash CS5.5. I recorded myself using the application for analytical testing. I didn’t have time to record respondents within the timeframe provided. I could have improved this by organising a focus group to gather results. Other changes would have been within the application build, which would have best suited JavaScript and HTML5 use the Eclipse SDK.

The experiment was set up to find out whether the application built has had an effect upon redeploying a website onto a hand-held device. Participants were provided with a survey (SurveyMonkey) that consisted of additional instructions. The number of participants resulted in fifty three and results were compiled into a stacked bar chart. The results highlighted that the majority of respondents did, in fact, have an enhanced experience with using the application.

Overall, the application experiences have proven quite effective from using the extensive research from previous arefacts. The research document provided a useful insight into building this application. I did not have enough time to complete the application due to time constraints. The results of the survey contribute to my research which argues that redeployed websites do enhance user experience of a website is various ways.

SPP3 - 5 images edited

After receiving feedback from my lecturer i decided to add a decryption to two of my images for the exhibition.

Artefact 6 - Results

The final artefact looked into redeployed websites onto an Android and iPhone device and whether they enhance/hinder their experience. The answers consisted of the following sections to outline their experiences; presentation, navigation, accessibility, content, clarity and speed. The sections were accompanied by a five sectioned rating system using; very poor, poor, average, good and very good.

The design and structure were built upon from artefact 5, where I tested the app for potential errors and faults. The app was built using Flash CS5.5. This incorporated actionscript 3 and consisted of new elements added in from the previous feedback.

Here is the results from SurveyMonkey...



Overall, the application experiences have proven quite effective from extensive research. The research document provided a useful insight into building this application. The results of the survey proven that redeployed websites do enhance user experience of a website, providing various enhanced experiences in relation to the desktop website.

Here are the results in figures...






Here are the results complied into a stacked bar chart...

SPP3 - 5 images

Here are the five images I'm going to be using for both SPP3 submission and will be included in the exhibition catalogue...

My client project website and mobile version for Palmhive Technical Textiles Ltd.

My simulated project about anti-piracy.



My online portfolio website NickCoxMedia



A freelance client project for NVTattoo.



A mobile app created during my personal research project for we7.com

Artefact 6 - Survey

Before i summarise my final artefact i have created a survey to contribute to my research question and artefact. My artefacts have been directing off course since artefact 4 due to the lack of skills and resources available to venture into 'voice controlled applications'. The reason to have a survey is to touch upon the usability of my artefact as it directly relates to my research question. The survey information is listed below...

My survey questions...

1. Rate the following elements based on the website application

2. Does the application format of the website enhance your experience based on the elements featured below?

Survey link - http://www.surveymonkey.com/s/Z89KDKG

Artefact 6 - Publishing Apps

To gain an understanding of application publishing further i have compiled a list of resources to find the best method in approaching publishing Android Air Apps (.apk) and Iphone Apps (.ipa).

1. A video showing how to develop apps with Andorid with Flash CS5



2. Creating an app using Basic4Android which uses Visual basic language with Android features.

http://www.basic4ppc.com/index.html

3. Creating an app using Eclipse and Android SDK (Javascript).



4. Use Google App Inventor to create a fast app but with limited options

Artefact 6 - Plan

To test my artefact i need to test the app against the website and provide participants a set of question touching upon the enhancing/hindering factors. Once the participants have finished the task and filled out the survey i will have statictics of wether redeployed apps/websites enchance users experience on hand-held devices?

I have no got to finish the app and deploy it to hand-held devices and make some final tests and corrections. To gain an understanding of what questions and tasks they can perform, i will research into surbeys and collectivley produce material for the testing stages.

Artefact 6 - Idea

For my final artefact i am going to build upon the app prototype from artefact 5. I received feedback which was useful for correcting content and adding additional features to the app. The point of the final artefact is that from research, the main contributing factors of enhanced experience on hand-held devices was the apps design, navigation and speed.

This artefact is going to be a finished product where i can show participants how an app can be designed effectively to bring structure and familiarity. The final artefact will be published from Flash Builder and consists of actionscript 3. The app run from Air 2.5 which is an additional feature in Iphone and Android 2.2 +

SPP3 - Update

Starting on the new task of creating new images for SPP3 I had a think about how to advertise my images.

I got the inspiration from browsing through previous catalogues, these certain designs were the ones that caught my eye, the ones that made the web designs stand out. It wasn't until I started designing that I realised that it will be quite difficult to capture a good image of a web site. The image after all will be all that the people at the exhibition will see.

Here are some images which that inspire me...

3D Stack

Span

Graphics style grid

Cover flow

Using technology

Artefact 5 - Evaluation

My fifth artefact looked into the effect of the scrollable type navigation on an app for a hand-held device; which was identified in artefact 3. This artefact looked into testing this type of navigation within an app on a hand-held device.

The design and structure was taken forward from artefact 3 where i added additional content to form a complete design. The app was built using Flash Builder along with actionscript 3; which consists of six pages reflecting the content provided from the we7 website.

The app was tested on an android mobile (HTC Desire) and an emulator (Android SDK). I recorded me using the app so I could further analyse for rectifying errors later. From initially testing the app I found several issues with the usability of the finished product. These were the following; there was not enough surface area to push the buttons on; this could have been solved with adding a ‘hit’ area within Flash. Some of the other issues included; slow loading time and missing stop frames on certain pages. The main element was the music player which was created as means of playing music from we7, which would sync with your playlist. Due to the timeframe and skills within app creation, I was only able to produce part of the music player.

The artefact was followed up with a focus group consisting of four people; this aided in outlining several key issues regarding the app’s usability. Main points identified were that the app needed an ‘introduction page’; which would have helped with informing users about certain elements of the app e.g. how to use it. From the results identified, I can progress on with editing the app and producing the final artefact where I will be testing against the we7 website.

Artefact 5 - Testing

Summary

My fifth artefact required testing on a hand-held device and is built using Flash Builder. The app is built from we7 and populated using there content. The app was tested on the Android SDK (http://developer.android.com/sdk/index.html) using the 'android-sdk_r10-windows.zip' version r10. The application was setup and ran from my desktop where i packaged up the required files in order to test 'as a developer' for debugging.

The app needed packaging which was learnt using Lynda.com online tutorials...

Tutorial Details:

Flash Professional CS5: Creating a Simple Game for Android Devices
Author: Paul Trani
Released: 2/15/2011
Duration: 03:35:00
Level: Intermediate

The tutorials gave me an insight into deploying a game which was not relevant but some parts were useful to take notes from. This lead me onto selecting the appropriate files to include before packaging.

The packaging process was used using the 'command line' on a windows based computer and successfully created an .apk using the following code...

cd C:/Users/Family/Desktop/AdobeAirSDK/bin/

(this was to set the folder location)

adt -package -target apk -storetype pkcs12 -keystore mycert.p12 we7.apk we7-app.xml we7.swf 36.png 48.png 72.png

(this was to target the swf and other files to make the app)

The video below shows as recording of me using the app on the Android Emulator for analysing purposes.

Artefact 5 - Music

The whole point of my app is to test the 'navigation' results from arefact 3. This will be tested but i need some content and music examples to engage with upon testing. So i have looked into adding in a mp3 player which will sit within the app and can play local/cashed music from the original website. This feature if i could build it would let users link online via Wi-fi and would be able to sync music with this app. This would provide and extra feature which would enhance the users experience.

So far i have managed to include some script which links a local .mp3 file which plays upon pressing the 'play' button within the app (screenshot below).

Artefact 5 - Progress

After researching endlessly on crating apps for my 5th artefact i stumbled across building my app within Flash Builder. This would provide me the best viable chance of producing a working app which i could publish on an Android phone. This is crucial to gathering results as it will need a touch screen interface.



So far i have delved into building the app and heres my progress so far...

What Ive got left to do...

• Finish the apps interface


• Add in some content


• Publish the app


• Test the app and evaluate

Artefact 5 - Update

From posting last i realised just how hard it is to build an app with know experience or guidance. I have looked further into building applications for IPhone or Android. I found a few tutorials and looked further into Eclipse for Javascript builders. This software is designed for coders but would allow me to build apps quicker than the Flash route. Speed is an issue due to having to test this app afterwards. My main concern is to build the app in time to get results, so i have decided to do a summary of this artefact and focus upon testing in artefact 6.

Here's screenshots of me working in Eclipse...

Client Project - VALIDATED

Now that i managed to fix the error from the previous validation attempt. I have successfully passed my first HTML5 / CSS3 Website!

Wooooooop!!!!!!

Client Project - W3c Validator

Before the project began i planned to check my website against W3C (http://validator.w3.org) and used my skills from the previous project (last year) and marked my HTML code up properly through the duration of the project hoping i wouldn't get 60 odd errors :(.

Now that my website is almost complete i ran the URL through the validator and got back 1 error!!!. Well good! 59 less than last time!!!.

Here is the error...



Heres what the error is...



From looking around through several fourms and google search i found a few useful websites.

http://wiki.modxcms.com/index.php/Beginner's_Guide_to_MODx
http://www.w3schools.com/html5/tag_base.asp

Ive looked into changing the way the code is written. I managed to alter the code and take away the 'base' from the end HTML markup.

From:



To:

Client Project - Survey

For my client project i though it would be a good idea to gather responses about the overall design of the palmhive website. I came up with a few questions which would provide me with useful criticism. I put my website link on a forum and asked what members thought.

Below is one of the responces i had from a member called 'dap' who's comments were quite useful. He points out that a better font to use would be 'Georgia' 'Verdana'. I tried these within my website and found that there was a drastic improvement. Here's what he said...

'try Georgia or then just plain Verdana

also increase the text size a little - and make it left aligned (not fully justified)

increasing the text size in my browser means the text is hidden by the footer

i would rather see a product picture(s) than a boring photo of the facility that serves no purpose - you could make quite nice 'patchwork' of those fabric hexagons for the header

good job overall though

i like the way you've put contact form in the footer'

Client Project - Mobile Website

Here is the mobile website version of Palmhive Textiles Ltd...

Client Project - Surveymonkey

For my client project i sent out a survey to collect responses for the complete Palmhive website. The survey consisted of the following questions;


1.What Browser did you view this website on?

Firefox/IE/Chrome/Safari etc

2.How did you find Palmhive website?

Please rate below (Very good/Good/Average/Poor/Very poor)

-Design/Look
-Navigation
-Finding content
-Readability of text
-Loading time of each page
-Clarity of labelling
- Availability of information

3. On a scale of 1-5 how would rate the overall website?
4. Can you think of anything else that could be included on the website?
5. Are there improvements that you could suggest to make the website more appealing?



Survey link: http://www.surveymonkey.com/s/3WWYWBR

From the survey i got a fair number of respondents (20) which only a handful commented upon question 5. Some of the criticism are shown below:

'No, its very good. gives the client what they need'

'Your about us page is very informative but when i go to a page homepage i dint want to be greeted with a novel, why not shorten this to one paragraph like a summary of what you do etc.. and add some products/examples, news or something like that.'

'I think the logo is too big yeah you want it to be memorable but i would reduce the size.'

Overall, the respondents rated my website 'very good' (4/5) on the survey scale. This is useful information to consider upon finishing the website.

Client Project - Cross Browser Test

Now that I'm soooooo close to the end, Ive been looking at AdobeLabs browser testing software to use as a means of testing Palmhive website in many browsers as possible. Here are the 14 browsers i got it working in...

Chrome 8 - Windows



Chrome 9 - Windows



Chrome 10 - Windows



Firefox 3.0 - OSX



Firefox 3.0 - Windows



Firefox 3.6 - OSX



Firefox 3.6 - Windows



Firefox 4 - Windows



Internet Explorer 7



Internet Explorer 8



Internet Explorer 9



Safari 3



Safari 4



Safari 5

Analytics

Before i can finish my template I need to incorporate Google Analytics into the websites design. This had to be done first as i need to duplicate the template for various pages and don't want to go through each one after including the necessary code. Below are pics showing me going through the process from signing up to placing the code into my template.

Signed up to Google Analytics

Inserted the provided code into my template within Modx