51
8/6/2019 Bachelor Thesis - Just Translate http://slidepdf.com/reader/full/bachelor-thesis-just-translate 1/51 BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011 1 Final Exam Project, 3 rd Semester BA Web Development 2011 – Erhvervsakadamiet Lillebælt Name: Morten Jonassen Client: Ordbogen A/S Hand In: May 27 th , 2011 Key Strokes: 87200 Prototype URL: www.justtranslate.mortenjonassen.dk Main Counselor: Lise Agerbæk

Bachelor Thesis - Just Translate

Embed Size (px)

Citation preview

Page 1: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 1/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

1

Final Exam Project, 3rd SemesterBA Web Development 2011 – Erhvervsakadamiet Lillebælt

Name: Morten JonassenClient: Ordbogen A/SHand In: May 27 th , 2011

Key Strokes: 87200Prototype URL: www.justtranslate.mortenjonassen.dk Main Counselor: Lise Agerbæk

Page 2: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 2/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

2

Title page3rd Semester Final Exam Project

Project Period:>>January 2011 – May 2011

Deadline:>> May 27, 2011

Education:>> BA Web Development, Erhvervsakadamiet Lillebælt

Name:>>Morten Jonassen

Client:>>Ordbogen A/S

Project Name:>>JustTranslate.com

Main Counselor:>> Lise Agerbæk

Prototype URL:>> www.justtranslate.mortenjonassen.dk

Page 3: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 3/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

3

Table Of Contents

Abstract ....................................................... 4Introduction ................................................ 5Problem statement ................................................................................................... 5

Methods and tools ....................................... 7Project management ........................................................................................................ 7 Interface design .................................................................................................................. 7 Web communication ........................................................................................................ 7

Project management .................................... 8 The project charter ................................................................................................... 8 The pre-study ............................................................................................................. 9

The basic idea ..................................................................................................................... 9The target audience ....................................................................................................... 11Situational analysis ........................................................................................................ 11

The development process ................................................................................... 13Developing with SCRUM ............................................................................................... 14

Conclusion on project management ............................................................... 16

Interface Design ......................................... 17What in the WEB is going on? ............................................................................. 17Sketching ................................................................................................................... 18

Pretty sketchy ................................................................................................................... 19Paper prototyping .................................................................................................. 21

A lively piece of paper .................................................................................................... 22Simplified thinking aloud ............................................................................................. 23

Principles of Designing Web interfaces .......................................................... 24

Make it direct .................................................................................................................... 24

Stay on the page ............................................................................................................. 25Conclusion on interface design ......................................................................... 27

Web Communication ................................ 28Establishing the identity ....................................................................................... 28

Identity structures ........................................................................................................... 28Logo development .......................................................................................................... 30

Groundswell .............................................................................................................. 32The social technographics profile ............................................................................... 33Tapping the Groundswell ............................................................................................. 35

Conclusion on Web Communication ............................................................... 37

Final conclusion ........................................ 38Literature ................................................... 40

Books .................................................................................................................................. 40Online ................................................................................................................................ 40

Appendices ................................................ 42

Page 4: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 4/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

4

Abstract The following bachelor report is part of my final exam project at the

web development education and is based on my work conductedduring a company work-place-internship at the Danish translationcompany Ordbogen A/S.As a new initiative, the company wants to develop a new commercialtranslation portal, where customers are able to upload entiredocuments and have these translated into one or more languages.Once the document is translated, the users should be able retrieve thetranslated document. The main question of this project has been howthis translation portal should be designed and developed in order toattract customers and serve as a serious alternative to competitivetranslation offerings. The report has been divided into the following three main sections:Project management, interface design and web communication.

In the first section I start the project management with establishingthe boundaries and requirements of the project with a project charterand a short pre-study. In the pre-study the target group and the basicproject ideas are identified. Additionally, the project is analyzed usinga situational analysis, which identifies key issues worthy of addressingin the development.Furthermore, the project management section provides an overviewof the advantages of using the agile SCRUM framework and itsconnected artifacts, which has been used to incrementally managethe entire project development during the internship.

The second section involves the interface design used in thedevelopment phase. The first part includes a simple sketching processwhere the initial ideation process has been executed. Based on an

incremental improvement of the sketches, paper prototypes havebeen created for testing purposes. The result of these is a lees is more drag and drop interface where the user is able to drag documentsdirectly into the browser and make very few selections to get thetranslation process started. Conducted usability testing on the paperprototypes provided the needed successful outcome in order to beginprograming a functioning prototype. In order to enhance theprogrammed prototype a carefully-chosen set of interface designprinciples has been applied to the solution. These have solvedusability issues regarding the use of the drag and drop functionalityand improved the general solution, enabling the user to stay withinan effortless flow when ordering the translations.

In the final section I look at a few communication strategies, whichenhances the overall trustworthiness of the solution and act as

branding initiatives, effectively positioning the new solution withinthe market. The first part of this process involves an identity programwhere the new translation portal is positioned within an endorsedcompany structure in order to utilize the current popularity of theOrdbogen A/S brand. Within this structure lies the development of abrand new logo, which creates a strong connection between thetranslation portal and Ordbogen A/S. The second communication initiative involves tapping into thegroundswell, which represents the online medias used by customersin order to create relations and exchange ideas. Within thegroundswell, the social media portals TrustPilot and facebook has

been suggested as effective ways of gaining customer retention byutilizing the individual power of each of these platforms respectively. The final outcome of the project and the report is effective strategiesand a programmed prototype, which takes full advantage of modernweb communication development and communication strategies.

Page 5: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 5/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

5

Introduction In this final bachelor project at the Web Development education inOdense, I will be working with the Danish translation companyOrdbogen A/S 1 - the largest online dictionary in Denmark. The examproject is based on an internal company project and the daily work during a three-month workplace internship at the company premises.

Ordbogen A/S is a joint-stock company with over 30 employees andwas founded in 2001. The company’s primary source of income stemsfrom online dictionaries, which are marketed and sold on the siteOrdbogen.com. The works include a vide array of dictionaries such asEnglish, German, French, Spanish, Swedish, technical, chemistry andmusic dictionaries, just to name a few. Ordbogen.com has opted for astable and high quality service and made dictionary look-ups veryeasy and user friendly with its add-free and simple layout. Thesefactors have made Ordbogen.com into largest language site andonline dictionary in Denmark. During 2010 Ordbogen.com celebrateda whopping five hundred thousand unique visitors a month.In addition to the dictionaries offered on Ordbogen.com the companyhas created a desktop dictionary program, an iPhone/iPad applicationand is currently working on an Android application, all of which canbe used in conjunction with the dictionary works.

The business base of Ordbogen A/S is to deliver a strong onlinetranslation tool, which always puts the needs and wishes of thecustomers first. The goal is to deliver qualified translations through

1 http://www.ordbogen.com

online dictionaries and translation products, which satisfies the needsof the customers – this is what the company calls Modern Translation. The vision of Ordbogen A/S is to become the language resource of theworld – No1 in Modern Translation.In order to fulfill these goals, the coming years will offer a variety of new and interesting projects and resulting customer products.

Among others, these new initiatives include the launching of newworks, such as a Danish/Chinese dictionary, a new international sitenamed Lemma.com, where users are offered six free dictionaries and anew dictionary program compatible with all the well-knownoperating systems.

Problem statementIn addition to the above-mentioned projects, Ordbogen A/S wants tolaunch a new translation portal during 2011. The purpose of thisportal is to provide customers with an online tool to upload andpurchase translations on complete or full sized documents.Examples of such documents include legal, economical, medical,technical and similar types of writings. The main focus of the portal isto deliver quick and professional translations in an easy and simplemanner, whilst prices are easily accessible and transparent.In order to deliver high quality translations in the fastest way possible,

the company is going to establish a large network of externaltranslators, who will use new and advanced machine translationtechnologies in order to deliver fast and professional translations.

Page 6: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 6/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

6

During my internship I have been given the task to design anddevelop a creative idea and overall concept for the front-end userinterface of the new translation portal. The assignment is delimited tocreating a prototype, which will act as a proof-of-concept of theinterface where customers can upload their documents, receivequotes and download their translated documents. Hence, this projectwill solely focus on front-end development and will not include anyactual API’s required to power the proposed solution.

Therefore, the main question for this project will be:

>> How can I design an innovative user experience, which will makeusers choose this application in favor of competitive document translation services aiding the company in their quest of becomingNo1 in Modern Translation?

In order to answer this main question I will need to answer thesecondary question of how this project should be planned andexecuted using project management tools and methodology.

Page 7: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 7/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

7

Methods and tools The following methods will be used in this project. Each of the items

will be explained in detail as they get introduced in the report.

Project managementProject charter 2 Pre-Study 3 SWOT4 Agile management 5 SCRUM6

Interface design

Sketching7

Rapid paper prototyping 8 Usability testingPrinciples of Designing Web interfaces 9

2 Project Management – a complete guide by Bo Tonnquist pp. 29-343 Project Management – a complete guide by Bo Tonnquist pp. 35-714 S.U.R.E.-fire direct response marketing by Russell Kern pp. 3-165 The Software Project Managers Bridge to Agility by Michele Sliger & Stacia Broderick 6 An overview of SCRUM for Agile – Retrieved fromhttp://www.mountaingoatsoftware.com/scrum/overview on April 2, 20117 Sketching User Experiences by Bill Buxton, pp. 105-1428 Paper Prototyping: by Carolyn Snyder, pp. 3-249 Designing Web Interfaces by Bill Scott & Theresa Niel

Web communicationIdentity structures 10 Logo design 11 Groundswell 12

10 The New Guide to Identity by Wolff Olins pp. 18-2611 Logo Design Love: A guide to creating Iconic brand identities by David Airey12 Groundswell, Charlene Li & Josh Bernhoff pp. 1-75

Page 8: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 8/51

Page 9: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 9/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

9

In larger projects, the project charter would often take several weeksto finish and be much more elaborate including several parts, such assuccess criteria, technical specifications, marketing initiatives andbudgets 14. However, due to the fairly limited scale of this project the

charter has been kept to a bare minimum since the main purpose inthis context is simply to establish an overview of the projectboundaries and quickly show you, the reader , what needs to be done.Furthermore, the agile development process, which has been used inthis particular project, does not cater for such extensivedocumentation, which I will address later in this section.Regardless, I believe the project charter has its place in all projectssince it provides a nice overview. The background or general ideahowever, may need some further elaboration in order to fullycomprehend the workings of the proposed solution. The followingpart should provide the big picture!

The pre-study With the initial requirements from the project charter in place, we arenow able to proceed with the pre-study phase. According to Tonnquist and Hørlück, the goal of a pre-study is to envision theproject before the actual planning and execution, which will helpstructure the project, analyze the current situation surrounding theproject and diminish the uncertainties around the project 15. The gatherings from the pre-study are often collected in a pre-studyreport, but again since this is a rather small project I shall only include

the most important parts. In this pre-study I have established anoverview of the project idea and analyzed the current situation of Ordbogen A/S . This gives the required insight of the project-

14 Web Project Management by Ashley Friedlein pp. 100-13715 Bo Tonnquist & Jens Hørlu  c̈k , Project Management – a complete guide, p. 35-76

boundaries before the actual development and execution iscommenced. Furthermore it serves as an extended introduction to thereader and outlines the project prerequisites.

The basic ideaIn order to understand how the concept will work in practice, whilstgenerating a viable business value, we need to take a look at the flowof the proposed system along with a few technical related concepts.Figure 1.2 illustrates the general process seen from a strict businesspoint of view. The parts should be pretty self-explanatory; the useruploads his documents, chooses one or more target languages plusadditional parameters and places his order. When the order isprocessed a translator will quickly translate the document usingtranslation memories and make it available to the user.

Fig 1.2

User uploadsdocuments

User selects optionsand recives a quote

User places the order

A person translates the

documents usingtranslation memories

The documents aremade available to user

Page 10: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 10/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

10

What are translation memories? Translation memories or statistical machine translation is interesting, but also a very large and complexsubject to cover, which unfortunately falls outside the scope of thisproject. Therefore, I will only touch upon the very essentials to get you

up to speed.Simply put; machine translation is the process of training a computerprogram to translate text between two different languages byinputting large amounts of human translated text into the program. The program will hereafter be able to translate documents based onadvanced statistical and mathematical calculations 16. As more text isstored in the program, the accuracy of the translations will increaseand the program will ultimately become a very effective translationassistant tool. It is expected that the amount of time used by thecompany translators, when translating the documents, will decreasewith up to 50% compared with traditional human translations without

the use of a translation assistant tool. This is a true win-win situationas it will not only save resources within the company, but also providecustomers with very fast processing times.

By now, you might be wondering – doesn’t the almighty Googleconglomerate already provide a similar and free of charge service?Well yes, sort of at least. Google does in fact provide a service namedGoogle translator toolkit 17 . Using this service, you can uploaddocuments and have them translated using statistical machinetranslation. However, no human translators are involved in theprocess, which may lead to utterly useless results. Consider the

translation example in Figure 1.3, translated from Danish into English,using the service provided by Google translate.

16 Moses - Retrieved from http://www.statmt.org/moses/?n=Moses.Background April 4, 201117 Google Translator Toolkit – Retrieved fromhttp://translate.google.com/toolkit/list?hl=en#translations/active April 7, 2011

Fig. 1.3

Of course this example is a deliberate attempt of fooling thecomputer, which obviously has no chance in hell of knowing what thecorrect translations are when dealing with such proverbs – however, ahuman translator would certainly have identified the difference. Ibelieve this example not only shows, but also justifies the need forcommercial translation portals with actual human beings, deliveringcorrect and professional translations.

The correct translation should have been:

“don't judge a book by its cover”

Translates into:

“one can not look at the dog hairs”

Original Danish text:

“man kan ikke skue hunden på hårene”

Page 11: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 11/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

11

The target audienceEssentially, the new translation portal and other services offered byOrdbogen A/S in general, are all about improving communicationbetween different language barriers and cultures. We are essentiallyall communicating, all the time, so one could respectfully argue thatthe target audience involves everyone. Nevertheless, the customersare likely to be diverse, and it is always important to considersegmenting the target audience when developing a web solution. This is the part where the most critical audience for the solution isidentified. The solution should be designed and developed so that itcan communicate specifically with these visitors. In this part I willbriefly establish the target group of the new translation portal. In theproject charter the end users are identified as being young DanishInternet users in need of professional translations, includingindividuals, companies and/or public institutions. This is a quite broad

definition and actually also an inaccurate one. In reality this solution ismarketed at a global audience and not just a Danish one, but thesolution will first and foremost focus on the Danish market and laterinclude initiatives to reach a global audience. However, in thedevelopment I will focus the propositions mainly on reaching aDanish audience. The target group can be further divided into B2C and B2B segmentswithin two main groups; private individuals and large companies. Theupcoming concept will primarily be aimed at private customers asopposed to larger businesses. This is due to the fact that specialagreements, features and discounts will be negotiated with the larger

companies who are more often in need of specialized and largeamounts of translations.

So, who are the so-called private individuals? Well, this could beanyone from the secretary at a small company wanting to translate a

user-manual, right to the college student wanting to translate hismidterm assignment. The aim will specifically be pointed towardsyounger users who are regularly online and comfortable with usingcomputers and modern technologies. Generally speaking, this target

group is more or less equal to the end users currently targeted at theOrdbogen.com website with the small exception of leaning moretowards smaller business clients rather than individual students. In thecommunication section I will take a closer look at the target groupand discuss how they can be reached with appropriatecommunication strategies, but this initial look should providesufficient knowledge to develop an appropriate solution based onthese characteristics.

With this background knowledge of the domain, target audience andupcoming solution in mind, we are ready to take a look at the

situational analysis or SWOT , which presents a picture of theprerequisites before commencing the planning and developmentphase of the project.

Situational analysisWhich factors, internal and external, might have an influence on theproject? According to Tonnquist and Hørlu  ̈ck the situational analysisseeks to provide an answer to this question 18. The situational analysisis also called the “SWOT” which is a well-known marketing andbusiness model. The goal of the SWOT is to compare potential

positive and/or negative factors, which might influence the executionof the project. External factors are the opportunities and threats andpositioned outside the project, whereas strengths and weaknesses are

18 Bo Tonnquist & Jens Hørlu  c̈k , Project Management – a complete guide, pp. 43-46

Page 12: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 12/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

12

internal factors inside the project 19. Conclusions are based on theanalysis, where the purpose is to match opportunities and threatswith its strengths and weaknesses by identification of possible gaps ormatches. Traditionally, the SWOT analysis is used for the entire

strategic and marketing planning of a company; however in this case,I use the methodology in regards to this specific project and thefactors, which may influence me personally during the developmentof the project.

Figure 1.4 shows the visual mapping of the SWOT analysis with itsconclusions and actions and indication of which sections in the reportI will handle the identified gaps or matches.I believe the SWOT gives a very good indication of the importantfocus areas. Firstly, we have the facilitators, which I think simplyindicates a promising potential in the upcoming solution. There are

no real prerequisites or boundaries, which mean the solution caninclude and explore completely new standards within the domain andcater for a bleeding edge solution with competitive advantages.Secondly, we have the obstructions, which I think provides the realimportant knowledge to take away from the SWOT since these factorsmay essentially hurt the project if not properly dealt with. Mostimportantly, the identified threats and weaknesses show the lack of acompany reputation and a general inexperience within this specificdomain, which could eventually create a trust issue and questioningof service quality among potential customers. As identified in theSWOT these specific issues will be addressed in the web

communication section of the report.

19 S.U.R.E.-fire direct response marketing by Russell Kern pp. 3-16

Facilitates ObstructsS1: No clear boundariesS2: Unbiased view of traditional translationS3: Possibility to create something completely new

and differentS4: Strong motivation to succeed

W1: The company is inexperienced withthis type of translation services

W2: Loosely defined project requirementsW3: Only one member in project groupW4: Limited time available

O1: Changing the way customers order translationsO2: Establishing a competitive solution within the

domainO3: Attracting customers

T1: Competition from established onlinetranslation companies

T2: Company has no reputation asdocument translators (not established)

T3: Customers may question the quality ofthe translations

Conclusions and actions Handled in….S1 + S3 +

O1

S2 + O2

No strict demands have been established therefore theproject is completely open and can go in whicheverpossible direction.

The project should not necessarily be affected by what isconsidered the norm within the domain but could be

new and different.

SketchingPaper prototyping

Interface designWeb communication

W1 + T2+ T3

S4 + W2+W4

The interface and visual identity should have an addedfocus on trustworthiness and should utilize thereputation of the established name ordbogen.com .

The project should ultimately deliver a creative solution,which the company may in fact find useable and not justact for me as show and tell.(Focusing on a limited amount of the overall solutionmay yield the best results.)

Web communication

The development process

W1 + O1+ O3

A new approach in document translation could be theway of gaining customer retention.

Interface designWeb communication

Fig 1.4

Page 13: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 13/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

13

The development processWith the knowledge gained from the pre-study let us take a look athow this project should in fact be developed. When we talk aboutdevelopment models we often talk about a waterfall approach and anagile approach. Let us take a closer look at the two:

The waterfall development method 20 is the method of working top-down. The development process can be seen as flowing steadilydownwards (like a waterfall) through the phases of requirementsanalysis, design, implementation, testing, integration, andmaintenance. This method depends on a fixed requirementspecification as the work is conducted in a linear manner, finishingone part completely before continuing with the next. The advantageof this approach is the fact that it is easy to manage as it follows afixed plan. The disadvantage however, is the fact that changing partsof the project may prove to be problematic since this may disrupt theentire project.

The Agile development method 21 is a reaction against traditional,heavily regulated methodologies, such as the waterfall method andseeks to diminish the disadvantages of such methods. Agiledevelopment is an iterative development process, which break tasksinto small increments and is based on the agile manifesto 22, whichstates the following:

- Individuals and interactions over processes and tools- Working software over comprehensive documentation

20 Dean Leffingwell & Don Widrig, Managing software requirements pp. 214-21521 Craig Larman. Agile and iterative development: a manager's guide pp. 25-2622 The Agile manifesto - Retrived fromhttp://www.agilemanifesto.org/ on May 11, 2010

- Customer collaboration over contract negotiation- Responding to change over following a plan

That is, while there is value in the items on the right, the items on the

left should be valued more, e.g. it is better to produce somethingtangible rather than just writing exhaustive documentation.Using this method means conducting parts of the project e.g.research, design, coding and testing in smaller iterations as illustratedin Figure 1.5 below. The Agile approach has the advantage of producing small finishedand tested “products” along the way. This is often beneficial sinceboth the client and project team gets some tangible evidence of theirworking efforts.

Fig 1.5

In this project I have chosen to use the Agile development approach.I have several reasons for doing so. Firstly, I believe the agile approachis much more flexible than the waterfall approach since it is possibleto respond to changes and alter the course of the project as the

Page 14: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 14/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

14

solution gets developed. Secondly, the factors identified in the SWOTanalysis beg for an agile approach. It would simply be impossible toplan a project like this using the waterfall approach since the exactrequirements have not been explicitly specified. The agile approach

will allow me to develop small increments, which can be presented tothe management and other stakeholders before continuing with thenext iteration. Based upon the evaluation of demonstrations, theupcoming iterations can either contain improvements to the work conducted in the previous ones, or contain further development tasks.Fourthly, the scale of the project, combined with the limited timemade available, makes it impossible for me to singlehandedlycomplete the entire solution; but, what gets finished in the individualiterations will theoretically be ready to ship. Therefore, the overalltime factor will not be an important issue during the project.Lastly, the company development-department, is already familiar with

the agile approach and use it with all of their projects, which makes itthe obvious choice from my part.

Developing with SCRUM 23 In order to manage and control the development phase withinthe agile approach it is beneficial to use some sort of frameworkto structure the work progress. The framework currently used atOrdbogen A/S is named SCRUM, which was originally developedby some of the same gentlemen who wrote the agile manifesto.In Scrum, the work progresses through a series of iterations alsoreferred to as “Sprints”, which lasts from 2-4 weeks. SCRUM ismade up of three artifacts; the product backlog, the sprint

23 An overview of Scrum for Agile – Retrieved fromhttp://www.mountaingoatsoftware.com/scrum/overview on May 11, 2010

backlog and the burndown chart24. The overall idea of the SCRUMFramework is illustrated in Figure 1.6. Here we see the productbacklog, which is just like a wish list of product features. Thefeatures of the product backlog is separated into small userstories with accompanying tasks and are developed during thesprints, which itself ends with a finished “product”.

Fig 1.6

24 Scrum artifacts – Retrieved fromhttp://www.scrumalliance.org/pages/scrum_artifacts May 11,2010

Page 15: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 15/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

15

An example of what was contained in the first product backlog can beseen in Appendix A. Based on the features in the product backlog,user stories with tasks are written on post-its and placed on theSCRUM board as seen in Figure 1.7, which visually shows the work

progress during a sprint. The amount of working hours involved witheach task is estimated during the sprint planning and written on thepost-it so the sprint progress can be tracked using the burndownchart. A complete sprint backlog with involved tasks from one of thesprints can be found in Appendix B.

Fig 1.7

Based on to their status, the post-its (tasks) are placed in one of thethree columns; TO-DO, CHECKED OUT and TESTED (done). Eachmorning the burndown chart is updated during the daily scrummeeting, which is a short stand up meeting where the progress is

evaluated amongst the team members 25 . Figure 1.8 shows theburndown as it looked at the end of sprint 4 in the project.

Fig 1.8

The x-axis represents the days in the sprint and the y-axis representsthe total amount of task in hours. The black curve represents theexpected burndown rate required to finish the sprint on time. When

25 The Daily Scrum Meeting - Retrieved fromhttp://www.mountaingoatsoftware.com/scrum/daily-scrum April 10, 2011

Page 16: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 16/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

16

the chart is updated, the remaining amount of task hours is plottedinto the chart and marked with the red curve. The goal is to have thetwo curves follow each other as seen in the figure. If the actualburndown curve (red curve) is above the black curve it means that

you are falling behind schedule and you need to put in some extrawork. If however the curve is below the expected burndown, it meansthat the task hour estimations are set to high. The scrum board is a great tool when working in a team, since all teammembers can get a fast update on the remaining work left in thesprint. Furthermore, the management and other stakeholders cantrack the progress of the project without disturbing the team.Despite the fact that the burndown chart in Figure 1.8 looks more orless perfect, making accurate estimations can be a bit tricky as Idiscovered in some of the other sprints. This is obviously a skill, whichrequires some amount of experience.

Nevertheless, I believe I have managed to use the SCRUM framework very effectively and gained a lot experience with this method. Duringthe project period a total of 4 sprints were planned and executed,each resulting in usable project increments, which I will discuss inmore details in the following parts.

Conclusion on project managementDuring this first section I have gone through the initial projectrequirements and background of the project, which were expressed ina project charter and expanded upon in a short pre-study phase.

In the pre-study, the background idea and the target group wereelaborated upon along with a situational analysis, which outlinedsome of the facilitators and obstructers in the project. The most

important take away from the SWOT was the identification of possibletrustworthiness challenges the upcoming solution might be facing. The nature of the project has been taken into careful considerationwhen deciding and choosing an agile development method as the

execution management tool of this project. The use of the agile SCRUM framework illustrated how it has beenpossible to produce small project increments (mini projects), whichare essentially finished “ products” .

This first section has shown how the development was managed butnot what was actually produced. In the following two sections I will gothrough the development and substantiate the results achieved in theSCRUM sprints.

Page 17: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 17/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

17

Interface DesignIn this section I will focus my attention on the processes involved inthe iterative development of the functional interface. The purpose of this section is to go through methods used in order to develop aninterface design, which has been used in the creation of a firstfunctional prototype. The following methods and tools have been used in this chapter:

>> Sketching , which has been used as an effective and quick way of visualizing initial design ideas.>> Rapid paper prototyping in order to transform thesketches into interactive interfaces used for user testing.>> Usability testing conducted on users using thethink-aloud protocol>> Principles of Designing Web interfaces , which enhancesuser experiences with selected patterns providingrich interaction.

What in the WEB is going on?My initial approach of commencing the interface design was to sitmyself in front of the computer and do a good old-fashioned piece of desk research in order to see what is happening within the industryamong some of the possible online competitors. The purpose wasprimarily to gain both piece of mind and inspiration, but also toidentify design patterns or possible best practices used online. Duringthis process I looked at the offered features from 6 differenttranslation companies. Based on these companies I have summarizedwhat I consider to be the most popular trends and common features,

which might eventually become relevant during further development. The full listing of identified features can be found in Appendix C

Identified features:§ Various account types or “user subscription levels” , which

includes different features depending on the specific level of payment.

§ Option to select extra features such as additionalproofreading at an additional cost.

§ Multistep web interfaces for document uploading withmultiple options such as: choosing L1 –> L2, choosefiles/upload files, nature of the document e.g. legal, financial,marketing.

§ When documents are uploaded a price is presented based onprice per word. Additionally an estimated delivery date is

given. At this point the user still maintains the ability to abortthe transaction.

§ Express and standard translation options are available wherefast delivery times takes precedence over quality.

§ The user is assigned to a personal customer consultant or“contact person” .

The informal desk research served as a good starting point andideation gathering process before the actual visualization of ideas wasbegun. I believe it is always beneficial to investigate an unknowndomain in order to decide whether to follow certain traditions, which

might exist, or perhaps break them entirely.With the accumulated knowledge in mind, the pen was nicelysharpened and the sketching process begun.

Page 18: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 18/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

18

SketchingIn this part I have chosen to focus on sketching, which I believe is animportant and integral tool when starting the ideation process of interface design. Buxton mentions some of the key attributes of sketching as being quick, inexpensive, disposable, plentiful,ambiguous and a suggesting rather than confirming process 26. Thismeans that sketches are great to visualize and explore ideas giventhat the goal of the sketching is not the sketch itself, but more aprocess of generating suggestions, criticism and changes.

By conveying the message that it was knocked off in a matter of minutes, if not seconds,the sketch says, “I am disposable, so don’t worry about telling me what you really think,especially since I am not sure about this myself.” (Buxton 2007 ; p. 105)

I think this quote illustrates the key essence of sketches, with theirgoal being suggestive and disposable ideation pieces, rather than predecided solutions. Fortunately, this means you do not need to be theprotégée of Leonardo da Vinci in order to successfully take onsketching since the strength lies within said process and not theactual outcome or sketch itself.Sketching can in fact take on other forms than pen and paper. It couldbe simple lines drawn in the sand at the beach, or perhaps even asketch created on a computer.

In order to understand how sketching (and later prototyping) plays arole in this project please consider the design funnel in Figure 2.0. Thefigure shows how the sketching is positioned as the ideation tool inthe starting phase of the interface design. The rising arrow illustrateshow the investment incrementally grows as we move along in the

26 Sketching User Experiences by Bill Buxton, pp. 111-113

project, going from simple sketches to paper prototypes andfunctional prototypes with corresponding usability testing. The lowinvestment in the start is where one can afford to learn and explore allideas since not much is at risk in this stage and thus, too much

concern about quality should actually be avoided27

.

Fig 2.0

27 Sketching User Experiences by Bill Buxton, p. 139

Page 19: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 19/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

19

Pretty sketchyNow, let us take a look at how one can get away with excruciatinglybad drawing skills, but still make good and successful use of thesketching process. The following are examples of how the use of

sketching enabled me to go from something abstract an unknowninto more tangible ideas. Figure 2.1 shows the very first initial idea of the home page or document-uploading interface .

Fig 2.1

This first and very simple sketch was the starting point of the ideationprocess and got perfected through the iterative sketching process,until landing on the result illustrated in Figure 2.2, which takes intoconsideration the best features identified from the desk research. Thesketch illustrates the entire ordering interface, which is divided into 3steps; Firstly, the user selects the source language and translation

language plus the nature of the document. Secondly, the user caneither upload the document or type in some text. Finally, the user isable to select additional features such as extra proofreading, expressdelivery or a personal message to the translator.

Fig 2.2

As the user adds options to his order, the order summary in the righthand side is updated with prices and selected options. When ready,the user may add his order to the shopping cart and continueordering more documents.

Page 20: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 20/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

20

The first ideas from the sketching iteration were discussed in aheuristic meeting with the company management and it-employeesfamiliar with the project. During this meeting several issues andpossible improvements were addressed.

Firstly, the management felt the idea was too traditional compared towhat is already offered by other companies.Secondly, there were too many options to select from, e.g. there is nopoint of having the user specifying the source language of hisdocument since the user already knows the language of his owndocument and thus, it only serves as a help to the actual applicationas it calculates the price. Thirdly, the choice to select extra features such as express delivery andimproved proofreading should not be present - the company alwaysguarantees a fast-delivered translation of a high quality regardless of the order type.

The main conclusion of the meeting could in general be summarizedinto an interface enabling the user to do as much as possible with asfew steps as possible and as fast as possible. Someone even coinedthe phrase “it should be as easy as drag and drop” and thus a newiteration of sketching was commenced.

Figure 2.3 illustrates part of the new idea where the issues andsuggestions from the meeting have been addressed. The interface hasbeen reduced to a very minimalistic drag and drop area with the focuson the actual uploading of the documents. In order to uploaddocuments the user can either drag files from the desktop and dropthem in the drop zone, or click the large upload button. The optionshave now been reduced to a bare minimum, enabling the user toquickly complete the process.

Fig 2.3

Page 21: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 21/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

21

When documents are uploaded the user simply has to select thetarget language in order to see the price before clicking the orderbutton. This should ideally spare the user of all unnecessary choices,which might have distracted or otherwise annoyed the user. Sketches

of this entire process is located in Appendix D.

Additionally, using the same process of sketching, a user area wherecustomers are able to log in, download their orders and administertheir account was created. Figure 2.4 shows one of the early sketcheswhere the user is able to view and download translated documents.Documents are displayed as individual blocks similar to the onesshown when the user uploaded his documents. The goal has been tocreate an experience as simple as the uploading part. This user areawill be discussed in more detail later in this section.

Fig 2.4

So there we have it - the process of conceptualizing, sharing,discussing and improving upon ideas using sketching. This methodwas certainly helpful during the first ideation process and shows how Ihave been able to go from an undetailed sketch to a more elaborated

idea. Obviously, the sketching mainly served as a theoretical ideagenerator since I at this point did not know whether or not the ideawould actually work in practice - this called for some creative use of pen, paper and scissors.

Paper prototypingAt this point I could have started to program the actual interfacebased on the sketches, but this would have been a bad idea since theideas had not been tested on real users. Testing the actual sketches onusers however is not really a viable solution since these are just static

representations and might lead to improper testing results. Instead, Ihave used lo-fidelity paper prototypes or simply paper prototyping .But what is paper prototyping and why is it the best thingsince sliced bread?

Paper prototypes are essentially interactive sketches where contentcan be updated by moving around folded or otherwise processedpaper pieces. Snyder defines paper prototyping as usability testingwhere users or testers performs pre-defined tasks and interacts with apaper version of an interface, which is controlled by a person acting asthe computer 28 . While the user performs tasks the “computer”

responds by updating the menus and contents. The paper interfacecan be as simple or complex as needed, depending on the type of

28 Carolyn Snyder – Paper Prototyping: The Fast and Easy Way to Design and Refine UserInterfaces pp. 3-5

Page 22: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 22/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

22

interface. The idea is to allow the user to perform the appointed taskswith as little guidance as possible.But why spend time on playing with paper? Well, this is all aboutgetting valuable user input on the proposed solution as early as

possible, when we are still capable of changing and improving theapplication without compromising the project in accordance with thedesign funnel we saw earlier.

Because the prototype is all on paper, you can easily modify it right after – or sometimeseven during – each usability test. You can conduct several usability tests in just a day or two, and it doesn’t take long to see the patterns in the feedback you’re getting. Thus, paper prototypes allow you to iterate and improve a design quite rapidly based on input from real users, and this can all happen before the first line of interface code is written.(Snyder 2003; p. 5)

The benefits of testing with prototypes are great because they are

easy to perform and take place early in the development. Our trusteedold friend, usability guru Jacob Nielsen, points to the fact thatgathering usability data as early as possible renders the biggestimprovements in user experience and benefits of early testing are atleast ten times greater than those of later testing 29.With these advantages in mind, let us get going.

A lively piece of paperFigure 2.5 shows two parts of the interactive paper application, whichI created, based on the sketches. The interface consists of two mainparts; the uploading interface where the user is invited to uploaddocuments by dragging and dropping them into the upload area, andthe logged in area where the user is able to retrieve the finisheddocuments and mange his user account.

29 Paper Prototyping: Getting User Data Before You Code. Retrieved fromhttp://www.useit.com/alertbox/20030414.html 25 April, 2011

Fig 2.5

Page 23: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 23/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

23

The process of creating this paper interface was quite joyful and nottoo difficult. Quickly, the interface started taking shape, using only afew sheets of carton and a couple of crayons. Even the entire browserwindow and a tiny hand on the pencil, acting as the mouse cursor,

were created. All in all, a simple and creative process reminding me of the time children spend in kindergarten. The next task aheadinvolved testing the interface on real users with the purpose of identifying possible usability problems.

Simplified thinking aloud Think aloud testing is a simple test where actual users are given testtasks involving the operation of the interface. During the test the useris asked to speak out his thoughts while interacting with the interface. The purpose is to retrieve as much user info as possible and observe if the interface holds any errors. According to Nielsen, think aloud

testing is a highly effective and easy tool to use when trying toidentify usability problems. In order to achieve the best results,Nielsen recommends conducting the test on as little as three to fivepersons whilst recording the sessions on video 30.

In this light I conducted the testing on five users, while documentingthe tests in video recordings 31. The sessions were divided between thetwo parts of the interface we saw in Figure 2.5. Firstly, the users wereasked to perform tasks involved with uploading of documents andretrieving prices and delivery dates. Secondly, the users were asked tofind previously uploaded documents and specific info regarding these

documents. The complete list of the testing tasks used in the tests canbe viewed in Appendix E.

30 Using Discount Usability Engineering - Retrieved fromhttp://www.useit.com/papers/guerrilla_hci.html April 25, 201131 Videos documentation available here: http://ge.tt/6s0ANaN

What were the results of the tests? Generally, the results looked quitegood – maybe even too good. In fact, only one minor issue, regardingsome missing close button a language selection overlay, was

detected. All users except one were immediately utilizing the ability todrag and drop the documents – the testers realized this opportunitydespite the very simple illustration of the arrow in the paperprototype. This part of the interface was apparently working very welland intuitive. The average speed of finding the selectable options wasvery fast. The testers found the interface very easy to navigate andquickly realized the workings of the interface. In fact, one tester didnot even speak Danish but still managed to use the interfacesuccessfully with minimal amount of instructions. Transcribedsummaries of each test are located in Appendix F.

So, why weren’t any major issues discovered during the test? Was thisa cause of bad testing from my part, or was the prototype simply thatwell laid out? I believe the latter is in fact the case. Although I mayhave overlooked minor potential usability issues during the tests dueto inexperience with this testing method I believe the tests revealedthat the overall concept worked exactely as hoped. In this respect, thepaper prototyping worked out very well and functioned as an initialprof-of-concept before any actual programming was initiated.

Page 24: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 24/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

24

Principles of Designing Web interfacesBased on the positive test result from the paper prototypes andhaving proved that the concept worked, a working prototype 32 of theinterface was developed. Please note that the developed prototypedoes not deal with visual design or digital aesthetics as such, butmainly deals with interaction design in terms of the functional design.In this part I will show how the user-experience of the interface hasbeen enhanced with selected patterns providing a rich interactionexperience. The purpose of the design patterns is to provide answersto key questions such as:

- How does the user know where and how to interact? - How does the user know a result has been achieved?

Scott and Neil seeks to provide answers by dividing best practicepatterns into the six key design principles; make it direct, keep itlightweight, stay on the page, provide and invitation, use transitionsand react immediately 33. In the following I will show and explainselected examples using some of these principles.

Make it direct The principle of make it direct means responding directly to userinteraction instead of treating input and output (e.g. a form and itscorresponding contents) as separate processes, by allowing inputwherever there is output 34 . This should ensure good usability in

creating an intelligent interface

32 Prototype: http://www.justtranslate.mortenjonassen.dk 33 Bill Scott &Theresa Neil, Designing Web Interfaces pp. 295-29634 Bill Scott &Theresa Neil, Designing Web Interfaces p. 2

Drag and dropA key attribute of the interface is the ability to drag and drop objects.When I initially set out to incorporate drag and drop in the solution Iwas a bit skeptical if the users would actually use such a feature. As I

surprisingly discovered during the testing of the prototypes all butone test user took advantage of the drag and drop possibility. Thiswas is a strong indication that users are in fact familiar with drag anddrop and appreciates the benefit.At first it may seem simple, but in fact drag and drop is a very complexattribute of interaction design. Drag and drop involves a large array of states or interesting moments with attributes and events, which mayinvite, inform and change before and during the drag and dropprocess 35.Drag and drop action 36 is the principle I have used in the interface. Thissimply means an action is performed on the files once they are

dropped. This is a similar principle used when dragging files from thedesktop to the trash. Figure 2.6 shows the process where the dropsignifies the upload. The user is informed throughout the process witha sufficient amount of useful hints enabling a smooth uploadexperience. Should the user not want to drag and drop the files forwhatever reason, a traditional browse button is provided, enablingthe user to select the files in a traditional manner. Furthermore thebrowse button ensures the interface follows the principle of gracefuldegradation 37 , which means the whole system will function asexpected even when using second-rate browsers such as InternetExplorer 6-9 or other browser, who does not support the HTML5 andJavascript used to power the drag and drop.

35Bill Scott &Theresa Neil, Designing Web Interfaces pp. 26-2936Bill Scott &Theresa Neil, Designing Web Interfaces pp. 52-5737 Graceful degradation - Retrieved from http://www.accessites.org/site/2007/02/graceful-degradation-progressive-enhancement/ May 10, 2011

Page 25: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 25/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

25

Normal state and invitation to drag Allows either browsing for documentsor simply dragging and dropping filesinto the dropzone.

Drag initiated The file is dragged into the dropzone,which turns green to indicate a validdrop target.

Dropped Once the document is dropped the

upload process begins automatically. The progress bar visually representsthe overall process. The user maintainsthe ability to cancel the upload.

Completed Once uploaded, the document isshown with name, extension,estimated delivery date, price andlanguage selection possibility.

Fig 2.5

Direct selectionAnother attribute of the make it direct principle is toggle selection,which is the most common form of selection on the web and afamiliar and easy way of allowing discontinuous selection 38. Figure 2.6

shows the toggle selection of documents when the user is logged in.

Fig 2.6

Here we see clearly which documents are affected using anunambiguous way of selecting or deselecting documents. This is avery straightforward way of discontinuous selection and no need toknow about any shift key selection and such. Most users will probablyrecognize this pattern since it is widely used in online mail accountssuch as Goggle mail and Yahoo mail.

Stay on the page This principle seeks to keep the user within the flow of the page. Thegoal is to create a seamless experience in context, free of distractions

such as a “page refreshes”. The ultimate experience is achieved whenthe user enters a stage of effortless control and the interface becomesa natural extension of the user 39.

38 Bill Scott &Theresa Neil, Designing Web Interfaces pp. 62-6739 Bill Scott &Theresa Neil, Designing Web Interfaces pp. 102-103

Page 26: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 26/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

26

Overlays The first example of staying within page flow is the overlay, whichkeeps the user within context by avoiding page refresh. The overlay isbasically the same as a browser pop up but with the advantage of

being controlled by the interface40

. Figure 2.7 shows a modal dialogoverlay (interaction is required) used when selecting the desiredtranslation languages once a document has been uploaded.

Fig 2.7

Here we see how the overlay does a nice job of keeping the interfaceclean by hiding the large selection of languages inside the overlay,which would otherwise have cluttered the interface.Figure 2.8 shows another example, which is a non-modal dialogoverlay of the log in form with an added lightbox effect creating astrong focus on the form. Since it is possible to upload documentswithout being logged in, it would disrupt the entire page flow to sendthe user to a new page if he decides to log in after uploading a coupleof documents. Here, the user is offered the possibility to continueadding documents after logging in.

40 Bill Scott &Theresa Neil, Designing Web Interfaces pp. 105-121

Fig 2.8

In this part we have seen some of the principles, which have been

easy and straightforward to apply to the interface providing a richerinteraction. The make it direct principle with drag and dropfunctionality provides an easy and transparent way of uploadingdocuments while toggle selection makes the process of downloadingthe translated documents just as easy. Using overlays as part of staying on the page ensures a non-interruptive and smooth page flowwithout page refreshes. With these principles implemented I believethe user experience is enhanced in such a way that the user will feel agreat deal of satisfaction when using the interface.

Page 27: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 27/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

27

Conclusion on interface designWith some of the key design principles applied to the interface we areready to conclude on the interface design.In this section I have gone through the creative process of visualizingand creating the first interface designs using an iterative sketchingmethod, which revealed usability issues but also provided a greatdiscussion foundation in the development of the paper prototypes. The sketching not only worked out well but it was also easy to do.Similarly, the process of creating paper prototypes was rewarding.Using the paper prototypes and the think aloud protocol, theinterface was tested with positive results on a set of users. During thetests the power of such type of testing quickly became evident as itmore or less showed how the interface would function in practice.Since only minor usability issues were identified, a working prototype

was developed. Here, key principles of designing web interfaces wereapplied in order to create a rich user-experience with drag and dropfunctionality as one of the main attributes of the solution.

In the next and final section, I will take a look at how the webcommunication should be tailored in order to further increase thechances of the developed concept becoming successful.

Page 28: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 28/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

28

Web CommunicationWith the developed prototype interface in the previous section, Ibelieve we are now quite close to have reached part of the solution of the main question initially set up in the problem definition. Theconcept of the new translation portal has been developed, but how isit possible to further improving the concept, utilizing relevant webcommunication methods? In the project management section, theSWOT analysis revealed possible challenges regarding the generaltrustworthiness of the solution. Furthermore, the SWOT outlined thefact that this is, of course, a brand new company venture, which mightrequire advanced communication strategies to be positioned firmlywithin the market. In this final section I will apply a few selectedmethods to the developed solution, which should enhance thecommunication in regards to the proposed concept, and seek to solvewith the communication challenges previously identified. The following methods will be used in this section:

>> Identity structures, which identifies the brand architecture andplaces the solution within a clear and consistent framework.>> Logo design, in order to develop a strong concept identity.>> Groundswell, identifying a strategy, which takes advantage of thesocial relations and opinion exchange on suitable onlinecommunication platforms.

Establishing the identity The purpose of an identity program is to establish and create thecorporate brand through frameworks, names, visual symbols andsuch. The goal is primarily to differentiate the company, or in this case,the new translation portal from competitors in the mind sets of

customers, potential customers and other opinion makers. Theidentity creation is essentially all about how the company and theprovided services are presented to the outside world.

The fundamental idea behind an identity programme is that in everything theorganisation does, everything it owns, and everything it produces it should project aclear idea of what it is and what its aims are.(Olins 2007; p.10)

I think this is especially important in the case of the new translationportal considering some of the identified communication challenges,which this solution might be facing.In the following, I will firstly start the development of the conceptidentity by establishing a proper identity structure of the newtranslation portal. Secondly, I will go through the development of asymbol (the logo), which will live within the chosen identity structure.

Identity structuresHow should the new translation portal be positioned within thecommunication architecture of the company? In order to be clear,easy to comprehend and consistent, Olins identifies the followingthree broad categories in which the identity can fall: monolithic,endorsed and branded 41. The categories are not equally exclusive andsome overlapping do exists. The identity structure highly dependsupon the specific company and is often based on traditions. Figure3.0 shows a visual example of how the three categories can structurethe identity of a company. This example is using the fictive law firm

named BigLaw, with its subsidiary companies.

41 Wally Olins, The New Guide To Identity pp. 19-26

Page 29: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 29/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

29

Monolithic The firm usesone name andone visualsystemthroughout

Endorsed The firm ownsa variety of brands, eachof which isendorsed bythe groupname or visualstyle

Branded The firm ownsa number of brands orcompanies,which areunrelated toeach other andthe firm

Fig 3.0

So, in which one of these structures should the new translation portalJustTranslate.com be positioned?Currently, the company is using a mix of multi-business identities inthe form of the endorsed and branded identities. As mentioned in the

introduction, the company offers several different services in additionto the dictionaries on Ordbogen.com, who are all quite similar toJustTranslate.com in the sense that they are individual services or products with varying purposes, within the translation field. Figure 3.1shows how the JustTranslate.com should be positioned inside thestructure with the other products/portals of the company.

Fig 3.1

The figure shows how Ordbogen.com, Lemma.com andJustTranslate.com are all being endorsed by Ordbogen A/S. Theportal Grammatip.dk is a brand new acquisition of the company and

Page 30: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 30/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

30

currently operates under the branded identity, which means that anyapparent relation between the companies is inexistent.According to Olins, companies who are using the endorsed identityare usually concerned with retaining the goodwill associated with

companies they have acquired, or are often operating in manydifferent countries and seeking to create an identity covering a widerange of activities 42 . Actually, this fits very well with the newtranslation portal. By using the endorsed identity it remains clear thatthe portal is in fact a part of Ordbogen A/S, which is importantbecause the company is highly respected within the translationindustry and among its customers. In this way the new translationportal can borrow from the popularity of Ordbogen A/S, assuringcustomers with the same high quality service known fromOrdbogen.com. Furthermore, the main Ordbogen A/S brand will,within this endorsement, receive added amounts of exposure, which

further helps the company in their overall market positioning. Still,the direct independency from the Ordbogen.com website will ensurea clear separation between these two different translation services.

So, with the concept firmly positioned within a cooperate-endorsedstructure, we are ready to visually encapsulate the identity using thevery heart of the identity programme – the logo .

Logo development The development of a logo is a vast subject area, which is perhapsmainly grounded within visualization and design theory rather thanstrict web communication. Nonetheless, it is still an important andintegral part of the identity creation, which essentially links it to theoverall communication strategies and decidedly relevant to include inthis part.

42 Wally Olins, The New Guide To Identity, pp. 22-24

A lot has been said and written about developing successful logos.Adams & Morioka simply defines the logo as a distinctive symbol of acompany, object, publication, person, service, or idea with the keyattributes of differentiating itself from the competition, providing a

clear identification, creating credibility and communicating themessage 43. As I see it, the main purpose of the logo or the symbol is toquickly and effectively present the central idea of the organization orin this case, the new translation portal. But how is it possible to createsuch a logo, which fulfills these essential attributes? Identity specialist,David Airey, considers the logo creation-process as a cooking recipewith seven basic ingredients, which accounts for a simple, relevant,enduring, distinctive, memorable and adaptable logo design 44. Theseingredients are as follows:

§ Keep it simple. A simple logo is more memorable and will

meet most of the other requirements of successful logodesign.§ Make it relevant. The logo should be suitable to the business

it represents and convey an appropriate message.§ Incorporate tradition. The logo should be designed for

sustainability and not use hot trends and styles, which mightbecome outdated quickly.

§ Aim for distinction. The logo should be recognizable. Thiscan be achieved by incorporating a distinctive mark or someform of unique quality or style, which represents what thebusiness is about.

§ Commit to memory. The logo should appeal to the memoryso people will instantly recognize it next time seeing it.

43 Logo design workbook by Sean Adams & Noreen Morioka, p. 1544 Logo Design Love by David Airey, p. 22

Page 31: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 31/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

31

§ Think small. An adaptable logo design, which can be used ina variety of different medias and contexts should be scalableand work at a minimum size of one inch.

§ Focus on one thing. Only one single distinctive feature

should be incorporated in the design. This will make the logorecognizable after only one quick glance 45.

With these attributes and vital ingredients, or guidelines , I believe weare equipped with the appropriate amount of knowledge, and readyto commence the actual logo development process. Firstly, let us takea quick look at the Ordbogen.com logo illustrated in Figure 3.2. This isthe logo known by customers, competitors and general public. Thecompany is using this in all its communication, both identifying thedictionary portal, but also the main company Ordbogen A/S itself.

Fig 3.2

Generally, the logo follows most of the above-mentioned guidelines. The graphical symbol ( the small man ) ads a memorable and uniquetouch to the logo, acting as the embodiment of the business gestalt.Right from the get go, the company has expressed a wish toincorporate this symbol in the new JustTranslate logo, which I think is

45 Logo Design Love by David Airey, pp. 22-39

a smart move considering the endorsed identity structuring discussedpreviously. With this in mind, the conceptualization process wasbegun using simple hand drawn sketches, which can be viewed forpleasure in Appendix G. During the sketching process, I tried playing

around with some different ideas of incorporating the symbol untilcreating the final digital result, illustrated in Figure 3.4.

Fig 3.4

Here, we see how the symbol has been incorporated within the type,substituting the letterform “ a”, which creates a nice touch and acts asa great focal point in the logotype . The substitution of the letter ads aslight humorous touch to the logo, conveying the story of apleasurable service along with the overall “transformation” of words,when being translated from one language into the other. The overallgoal here has been to create a logo design, which will capture theeyes of the viewer in the same way it is achieved in the original logo,adhering to the guidelines of the mentioned logo design recipe. Atfirst sight, the two logos may look quite similar, but each of them areunique in their own way. Of course, we have the symbol within thetype, and the name expressing the message of effortless translation.Furthermore, the font type has been changed into the Futuratypeface. The future typeface is a very popular timelessly, modern,elegant and no-nonsense sans serif type developed by Paul Renner in

Page 32: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 32/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

32

1927 46. This type has primarily been chosen due to its appearance of efficiency and forwardness in the geometric shapes of the characters,which wraps nicely around the round curves of the small man. Thedifferences between the two logos will instantly let the viewer know

that they are both representatives of the same company, while bothmaintaining two different purposes.

With this I believe we have established parts of a successful identity of the new translation portal. By positioning the portal within theendorsed identity structure, it has been possible to create a logodesign, which express some of the same core values identifyingOrdbogen A/S. Additionally, the logo represents the innovation,forward thinking and untraditional way of translations, which thetranslation portal represents. Initially, the result of this identitycreation should hopefully provide an added credibility to the solution,which promotes it into a secure and trustworthy choice in the mindsof potential customers.

One might argue that the above-mentioned initiatives will mainlyinfluence the views and decisions of people already familiar with thehigh quality services offered by Ordbogen A/S, which I think this hassome truth to it. Therefore, in the next part I will identify additionalways of establishing added credibility and exposure, ultimatelyreaching and even bigger market segment.

46 Futura font - Retrieved fromhttp://store2.adobe.com/cfusion/store/html/index.cfm?store=OLS-DK&event=displayFont&code=FUTQ10003000 May 10, 2011

GroundswellAs important as the established concept identity might be, we stillneed to utilize additional strategies to get the good word about the

offerings out in public. I do not believe this is something, whichshould be achieved with expensive advertising campaigns, as theseoften will detract rather than adding to the credibility. A form of word of mouth strategy might be more effective – and economical .

It doesn’t matter whether you’re selling real estate, jelly, or jet engines. People will ask other people about you before they decide to buy from you. We turn to people we trust first – friends, family, coworkers, and other people like us – when starting to look for something to buy. Not ads, not brochures, not phone books.(Sernovitz 2009; p. xv )

Naturally, people are talking, but how can we harness theirconversation and turn it into our advantage? One possibility could beto manage the groundswell.According to Li & Bernhoff, the groundswell is the online platformwhere customers and potential customers are nurturing their relationswith one another. The groundswell is a general term for the variousmedias connecting people socially, be they blogs, virtual worlds,facebook, twitter or similar online platforms 47.However, the importance of the groundswell does not lie within theactual technologies but within the relations formed by the peopleusing them. It should be noted that word of mouth may be dangerousif the customers are treated badly or otherwise unsatisfied with the

services discussed in the groundswell. This should hopefully not be anissue, as I expect the company to treat their customers with respectand react positively on any constructive criticism.

47 Groundswell, Charlene Li & Josh Bernhoff pp. 17-37

Page 33: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 33/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

33

The social technographics profileIn order to successfully utilize the groundswell it is essential tosegment users according to the groundswell activities they are taking

part in – this can be compared with demographics or psychographics. The social technographics profile is the tool to segment the groupsaccording to their relations, but not to the actual technology they areusing 48. As illustrated in Figure 3.5 the group can be segmented on aladder into six different profiles, in relation to their activities in thegroundswell. Each step of the ladder represents a group of users moreinvolved in the groundswell than the previous steps. With the socialtechnographics profile we can understand how users adopt varioussocial technologies in the groundswell and build an appropriate socialstrategy based on their behavior.

So, how is the target group of the translation portal placed on thesocial technographics ladder? In order to answer this question weshould take a closer look at the target group initially identified in thepre-study. Here, I loosely identified the target group as Danish userswhom are regularly online and comfortable with using computers andmodern technologies. In order to place the target group on the ladderwe can input relevant data attributes into Forrester's Social Technographics classification tool 49. Based on proprietary Consumer Technographics survey data, the tool shows a high-level snapshot of the social technology behaviors of the consumers.

48 Groundswell, Charlene Li & Josh Bernhoff pp. 39-62 49 The Social Technographics Profile Of Your Customers - Retrieved fromhttp://www.forrester.com/empowered/tool_consumer.html May 10, 2011

Fig 3.5

Page 34: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 34/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

34

Unfortunately, the Forrester tool does not accept Danish users as avariable, but it does accept Swedish users, whom I will consider toresemble Danish users in terms of online activities. In order to reach asuitable target segment the age span should lie within 18-34 years

based on the company wish of targeting a young audience.Figure 3.6 shows the retrieved results after entering the variables intothe classification tool. The bars to the left indicate the average participation of the entirepopulation and the bar to the right shows the participation of theentered segments. Indexes above 100 indicate a higher participationthan the average.

As seen, the predominant profiles in the segmentation are thespectators and joiners. From the technographics profile we know that joiners are characterized by maintaining social network profiles wherethey add to discussions about interesting ideas and concepts.Furthermore, we have the spectators, who consume the contentproduced by the profiles higher on the ladder. It is not all thatsurprising that these represents the largest group since countlesspeople are maintaining their profiles on for example facebook.

More interesting is the relatively large amount of critics. These react tocontent online, comment on forums/blogs, post comments, reviewsand ratings. If we focus our attention on this segment it will influencethe joiners and spectators further down the social technographicsladder. This leaves us with the question of how we effectively can takeadvantage of these profiles, within the groundswell.

Fig 3.6

Page 35: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 35/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

35

Tapping the GroundswellIn order to successfully tap into the groundswell it is essential toconsider the objectives. What are we actually trying to achieve? In

general, only one of the following five different objectives should bepursued in the groundswell: listening, talking, energizing, supportingand embracing 50 . The objectives should be more or less self-explanatory – it is about the communication between customers andthe company, and especially communication in between thecustomers themselves. The best-suited objective, in the case of JustTranslate.com, is theenergizing objective. I started the groundswell discussion with theword of mouth advantage, and in fact the energizing objective meansfinding the most enthusiastic customers, and taking advantage of thepower of their word of mouth. We want to get the users talking about

their experience when using the translation portal. This will not onlyenhance the credibility amongst users, but also act as free promotionof the service.As mentioned earlier, opening up to an uncontrolled dialogue onsocial networks and other media platforms may have unforeseen orunpleasant consequences.However, customers will be talking, and social interactions will not goaway and should therefore be embraced.

What if your customers engage but not in the ways you expected? An unwillingness to assess and address the way that social technologies changecustomer relationships dooms many a project.

(Li & Josh 2008; p. 74)

50 Groundswell, Charlene Li & Josh Bernhoff pp. 68-70

There is no avoiding the groundswell, but with the proper strategy wecan try and tap into its benefits. With this in mind, it is time to includethe technology. In the following I will look at two different types of social platforms, which I believe fits well with the identified

technographics profiles.

Using Trustpilot 51 Trustpilot.dk is a popular consumer generated platform where usersare able to rate and post reviews about Internet retailers. According tothe Internet ranking company Alexa, Trustpilot.dk is ranked high inDenmark in terms of visitors, with a total ranking of 83 with 1 beingthe highest achievable. Furthermore, the largest group of users lieswithin the age span of 25-44 years 52. The driving force of Trustpilot isthe user generated reviews and the TrustScore, which rankscompanies on a scale from 0-100, where the purpose is to achieve ashigh a TrustScore ranking as possible. The Trustpilot portal seems likea perfect choice when targeting the critics and joiners from ourtechnographic profiling. The platform is an ideal platform in thegroundswell when trying to get customers conversation going.Retaining customer reviews can be attained in different ways. The Trustpilot link could for example be placed on the frontpage of thetranslation portal, but even better we could simply ask the customersto rate the service once they receive their translations.Obviously, it will take some time to collect a decent amount of reviews, but once achieved, it will act as free promotion and thus actas a credibility enhancement.

51 Trustpilot - Retrieved from http://www.trustpilot.dk/ May 12, 201152 Alexa the Web Information Company - Retrieved fromhttp://www.alexa.com/siteinfo/trustpilot.dk# May 12, 2011

Page 36: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 36/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

36

Using facebook I do not think facebook needs any exhaustive introduction. Unless youhave been living under a pile of rocks you are most likely alreadyhighly familiar this platform, which has become synonymous with the

very uprising of digital narcissism in todays society. This is currentlythe hot place to be when sharing personal stories, experiences, likesor dislikes. On facebook, we will find a high amount of technographicprofile critics, joiners and spectators who are posting and sharing theirthoughts on just about anything. If we do not utilize the power of thisplatform we are not tapping the groundswell.

So, how can we effectively use facebook and get the users involved?Firstly we can create a facebook page. A facebook page gives thesolution an identity on the network, where news can be publishedand customers can post their thoughts.A great advantage of the facebook page is when customers becomesa fan of the page all of their friends will see that they have become afan, which often attracts other followers as and creates a buzzregarding the business. In order to effectively take advantage of thefacebook page, the company needs to spend some amount of resources on involvement, updating with news and keeping acommunication going with the users. In order to grab the users andget them involved we can use a nice little feature of facebook, whichincidentally acts as a usability enhancement also. Facebook offers aservice named facebook connect, which simply put, allows users tolog in using their facebook credentials 53. Figure 3.7 illustrates how thiscould be implemented on the translation portal login overlay. Herethe user will be able to link up their two user accounts and log intoJustTranslate.com while currently logged into facebook. This serves as

53 Facebook for Websites - Retrieved from http://developers.facebook.com/docs/guides/web/ May 12, 2011

a great usability improvement in relation to the user, since a lot of users are always logged into facebook anyway, but it also helps thecompany in their facebook promotion efforts.When user accounts are linked, it is possible to ask for the users

permission to post messages on their facebook wall, according totheir activity on the translation portal, e.g. when they have ordered orreceived a new translation. In this way we effectively get the buzzgoing and encourage the customers to offer their experiences whenusing the translation service.

Fig 3.7

Page 37: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 37/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

37

With the above suggestions of using TrustPilot and facebook I havesubstantiated some of the ways in which we can take advantage of the groundswell. Each example show how we can engage in thegroundswell and utilize the power of these platforms to get a

discussion going, which should enhance the overall credibility of thenew translation portal. If the company adopts these initiatives andshows involvement they will hopefully be left with happy customerscoming back for more. Of course, there are most certainly other socialnetwork platforms, which could be successfully included in order tofulfill our energizing objective. However, I think the two examples arethe most relevant and effective here in Denmark at the time being.When JustTranslate.com finally gets implemented, and eventuallytargeted towards an international market, a new groundswell strategyshould be ideally be implemented to cater for the new market and thetrends within the groundswell.

Each company must adopt the tactics that are right for its customers and its way of doing business and adapt as the technologies change.(Li & Josh 2008; p. 75)

However, the mentioned examples suggest the first effectiveinitiatives. After all, there is no turning back - the groundswell is hereto stay. Like the project development of this project, it should behandled iteratively to meet the changing trends of the groundswell.

Conclusion on Web CommunicationIn this section I have looked at ways of enhancing the general webcommunication surrounding the new translation portal. The purposehas been to meet the challenges of creating credibility andtrustworthiness while promoting the solution in order to attract thecustomers. The first part involved positioning the company within a

proper identity structure. Here the endorsed identity structure waschosen, which had the advantage of utilizing the existing popularityof Ordbogen A/S making it clear that the new translation portal is infact a part of the main company. Secondly, a new logo was developed

based on the endorsement of the main company. The new logoconforms to suitable principles of good logo design and incorporatesthe characteristic symbol from the original Ordbogen.com logo. Thenew logo ensures a visual link to Ordbogen A/S and visually expressesthe endorsement from the main company. This way, customersshould be assured with a similar sense of experience as when usingOrdbogen.com, thus creating some form of credibility.In the second part of this section, I have included examples of how thecompany can successfully take advantage of the online relationshipsand communication, which is taking place on social media platforms,knows as the groundswell . An important part of creating a suitableweb strategy was the segmentation of the target group according totheir online behavior. Here, the critics were chosen as the mostsuitable segment since these represents are large segment of thetarget group, along with the fact that they are quite productiveparticipants in the groundswell. Based on this segment, I suggestedthe inclusion of the two popular online portals; TrustPilot andfacebook. With these two portals it is possible to energize theparticipants, enabling them to share their experiences and hopefullyrecommend the service within their network. If the customers will infact find the service satisfactory and embrace the groundswellinitiatives, this will greatly enhance the credibility of the solution andadditionally act as effective promotion. However, if these initiativesare to be successful in the long run, it is absolutely essential that thecompany will invest the appropriate amount of resources and meettheir customers needs and wishes within the groundswell.

Page 38: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 38/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

38

Final conclusion The report, which has taken us through a lot of exciting areas andtheory, is sadly coming to an end and I am now ready to offer my finalquotations of this project. But, before I do, lets us refer back to themain question initially set up in the problem statement. Here, I askedthe following main question:

How can I design an innovative user experience, which will make userschoose this application in favor of competitive document translationservices, aiding the company in their quest of becoming No1 in ModernTranslation?

In order to answer this question I began the process with the projectmanagement section, covering a small pre-study and establishing the

most suitable development method. The main outcome of the pre-study was the establishment of the project boundaries and asituational analysis revealing some of the critical factors of the project,which has been addressed during the sections of the report. Mostimportantly, the situational analysis identified a general need of enhancing the overall credibility of the solution, which has beenaddressed in the previous communication section. In the projectmanagement section, I described the agile development approach,which was used within the framework of SCRUM. This approach wasprimarily chosen based on the loose project requirements of theproject and allowed me to successfully work methodically with the

project development, carefully planning and completing smallincrements or sprints of the project whilst tracking the overall progresson sprint burndown charts.

The second section covers the interface development, which wasexecuted during the sprints. In this phase, I worked with the ideationprocess using simple paper sketches, which was evaluated andimproved upon before moving onto creating a paper prototype of the

supposed interface. This was an incremental process, which graduallyimproved each sketching idea before moving on to the next. The goalwas to create a vey powerful interface, enabling the user to achievemuch with as less effort possible, when uploading documents,choosing target languages and receiving quotes. The paperprototype, which featured a simple drag and drop document-uploading-interface was successfully tested for usability on a relevantgroup of users. The tests effectively showed how the usersexperienced the system, which evidentially turned out to be very fun,easy and intuitive to use. With the successful outcome of the usabilitytesting, the interface was implemented into a working prototype,taking advantage of the possibilities offered by JavaScript and thenew HTML5 specification, which makes the desktop-to-browser dragand drop possible. In order to improve the overall usability, an array of web interface design principles was applied. These principlesaddressed some essential user feedback issues when working withdrag and drop and included general improvements of keeping theuser within the flow of the page, using overlays and direct selectionswhere relevant.

In the final web communication section, I addressed possiblestrategies regarding the credibility of the overall solution and thepositioning within the market. Here, the general question of earningtrust among the users has been addressed. Firstly, a concept-identityhas been created, positioning the solution within an endorsedidentity structure. This way the concept is linked closely to the maincompany, which should offer some of the needed credibility amongst

Page 39: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 39/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

39

possible customers. This endorsement between the main companyand the new translation has been visually expressed in a new logo,which was developed according to good logo designing practices. The new logo is reusing the symbol from the original company logo,

in order to visually connect the two. The hope has been to takeadvantage of the current brand already synonymous with OrdbogenA/S while creating a strong endorsed identity. This logo will serve asan important tool when establishing a general brand identity.

In order to improve the trustworthiness and general credibility, somegroundswell thinking has been suggested. By identifying how thetarget group behaves and socializes on online communicationplatforms, the social platforms TrustPilot and facebook has beensuggested included in the communication strategy. These are twogood examples, which, with some amount of effort, will make aconversation between customers and potential customers possible. The expectation is pointing towards an engagement, which will createcredibility and serve as added promotion of the solution.

Finally, I believe the outcome of the project has met both my ownexpectations and the expectations of the company, and I firmlybelieve the above implementations and suggestions have the neededpotential of attracting customers and separate the new translationportal from competitor offerings. However, this is by no means afinished ready to ship final product. I have simply provided the firstessential initiatives with the limited time made available to me. Ibelieve the work represents some of the power of the agiledevelopment approach since the company is left with finishedincrements and need not go a long way to make final implementationsand fulfill their ultimate goal of becoming No1 in Modern Translation .

Page 40: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 40/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

40

LiteratureBooks Tonnquist, B., & Hørlu  ̈ck, J. (2009). Project Management - A CompleteGuide. Academica.ISBN: 978-87-7675-728-1

Ashley Friedlein (2001). Web Project Management - Deliveringsuccessful commercial Web sites.ISBN: 978-1-55860-678-4

Russell Kern. S.U.R.E.-fire direct response marketingMcGraw-Hill; 1 edition (March 9, 2001)ISBN: 978-0658006227

Dean Leffingwell, Don Widrig (2001). Managing softwarerequirements: a unified approach.ISBN: 0-201-61593-2

Craig Larman (2003). Agile and iterative development: a manager'sguideISBN: 0-13-111155-8

Bill Buxton (2007), Sketching User Experiences – Getting the designright and the right designISBN: 978-0-12-374037-3

Carolyn Snyder (2003) – Paper Prototyping: The Fast and Easy Way toDesign and Refine User Interfaces.ISBN: 978-1-55860-870-2

Bill Scott &Theresa Neil (2009), Designing Web Interfaces

ISBN: 978-0-596-51625-3

Wally Olins (2007), The New Guide To IdentityISBN: 978-0-566-07737-1

Sean Adams & Noreen Morioka (2004), Logo Design WorkbookISBN: 987-1-59253-234-6

David Airey (2010), Logo Design Love: A guide to creating Iconic brandidentities.ISBN: 978-0-321-66076-3

Andy Sernovitz (2009), Word of Mouth Marketing: How SmartCompanies Get People TalkingISBN: 978-1427798619

Charlene Li & Josh Bernhoff (2008), Groundswell - Winning in a WorldTransformed by Social TechnologiesISBN: 978-1422161982

OnlineOrdbogen.com main page:

http://www.ordbogen.com

An overview of SCRUM:http://www.mountaingoatsoftware.com/scrum/overview

Page 41: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 41/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

41

Moses translation memories:http://www.statmt.org/moses/?n=Moses.Background

Google Translate:http://www.translate.google.com/toolkit/list?hl=en#translations/active

The agile manifesto:http://www.agilemanifesto.org/

The Daily Scrum Meeting:http://www.mountaingoatsoftware.com/scrum/daily-scrum

Scrum artifacts: http://www.scrumalliance.org/pages/scrum_artifacts

Paper Prototyping: Getting User Data Before You Code:

http://www.useit.com/alertbox/20030414.html

Guerrilla HCI: Using Discount Usability Engineering to Penetrate theIntimidation Barrier:http://www.useit.com/papers/guerrilla_hci.html

JustTranslate prototype:http://www.justtranslate.mortenjonassen.dk

Graceful degradation and progressive enhancement:http://www.accessites.org/site/2007/02/graceful-degradation-progressive-enhancement/

Futura® Std Light:http://store2.adobe.com/cfusion/store/html/index.cfm?store=OLS-DK&event=displayFont&code=FUTQ10003000

The Social Technographics Profile Of Your Customers:http://www.forrester.com/empowered/tool_consumer.html

Trustpilothttp://www.trustpilot.dk/

Alexa the Web Information Company:http://www.alexa.com/siteinfo/trustpilot.dk#

Facebook for Websites:http://developers.facebook.com/docs/guides/web/

Page 42: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 42/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

42

AppendicesAppendix A (Product backlog) ......................................................................... 43Appendix B (Sprintbacklog, Sprint IV) .......................................................... 44Appendix C (Competitor research) ................................................................. 45Appendix D (D&D interface sketches) ........................................................... 48Appendix E (Tasks for paper-prototype user testing ) .......................... 49Appendix F (Think aloud test results) .......................................................... 50Appendix G (Logo sketches) .............................................................................. 51

Page 43: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 43/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

43

Appendix A (Product backlog)

Product backlog: TM Extreme

User Interface

NameUser interface

StoryA new user interface, which enables users to upload small to large sizeddocuments, will be designed and prototyped.

Using this interface, commercial customers will be able to log in andupload text documents, which needs translation. The user shall specifythe verbal nature of the document such as legal, technical, economicalor marketing documents.

Once the document upload is completed the user is presented with aprice estimate based on the amount of words and percentages ofrepeated words – the user is given the possibility to accept or declinethe order.

When the user is logged in she will get an overview of her overall statusregarding uploaded documents and their current process (e.g. pending,in progress, finished). If the document is in progress, the user will beable to view a preliminary preview of the translated document.

Furthermore the user will be able to access and retrieve her previouslytranslated documents stored on the database.

Definition of done

The sprint is done one when a design has been decided upon. Thedecision will be based on comments and feedback from the testing ofpaper prototypes. The tests will include web professionals and laymen.

Page 44: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 44/51

Page 45: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 45/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

45

Appendix C (Competitor research)http://www.translia.com/

Features:§ Service levels: gold, silver and bronze. The gold level offers additional services such as

multiple translators for each document with added proofreading and such.§ Documents are delivered in the same format as they are handed in.§ Languages: Price is based on a $ per word depending on the chosen language§ An account manager is assigned to each client.§ Volume discounts are offered to returning customers.§ Upload unlimited amount of documents.§ Turnaround time (delivery estimate) is indicated in days when document is uploaded.§ Option to order accelerated delivery – (time over quality) at no additional cost.

http://www.trustedtranslations.com/

Features:§ Translator teams specializing in legal, financial, business, manual, marketing, media,

medical etc.§ Proofreading by industry specific experts.

Page 46: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 46/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

46

www.onehourtranslation.com

Features:§ 3 step translation: L1->L2, file upload (supports multiple files), translate based on a $

per word ratio.§ Further features: Expert selection - nature of text e.g. general text, legal, software,

business and such.§ Extra paid feature: proofreading (pay per word)§ Special offer: Buy x amount of words and receive additional free words.§ Price calculation tool (Instant Quote): Input -> words, proofreading, expert translator.

http://www.translated.net

Features:§ Instant quote (price calculator): Input types -> language, subject, word count delivery

dates.§ 3 types of offers are used: premium, professional, economy§ Use of translation memory is advertised in the mentioned offers.§ Payment after 5 days.

Page 47: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 47/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

47

http://www.tolingo.com

Features:§ Input text and text upload with selectable language§ Text categories (nature of text)§ Express or standard translation§ Price and estimated time is shown upon uploading§ Indication of translation memory

http://www.linguae.com

Features:§ 3 step process: L1 -> L2, upload file, create account before offer is shown§ Prices based on $ per word.§ Offers quick translation -> shows visibility of current translation status

Page 48: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 48/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

48

Appendix D (D&D interface sketches)

Page 49: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 49/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

49

Appendix E (Tasks for paper-prototypeuser testing )User scenarios:As a user you want to retrieve prices and estimated delivery dates forthe translation of two documents. First document is a .pdf in Danish,the second document is a .doc in English.

Tasks – Upload interface:

1. Upload both documents

2. Find the prices and estimated delivery dates for translation of thetwo documents:

1st

Document: Is a Danish document called test.pdf and must betranslated into English, French and Norwegian.

2nd Document: Is an English document and must be translated intoDanish.

3. Find the total amount for the order of the two documents and placethe order.

4. You decide you only want to order the Danish document, what doyou do?

5.

You want to translate test.doc (a German document) but when youupload the document the system identifies the document as beingEnglish. What do you do? Go!

6. You have just uploaded the document test.pdf in assignment 2 –thistime around you do not want to have the text on images translated.What do you do? Go!

Tasks – Retrieve documents

1. Du har tidligere bestilt en oversættelse fra Dansk til Engelsk pådokumentet stats.doc . Hvornår er dokumentet klar til download?

2. Download alle dine oversatte dokumenter

3. Du ønsker kontakt med kontaktpersonen på det dokument duuploadede i opgave 1 – hvad er navnet på kontaktpersonen oghvordan kontakter du vedkommende?

Page 50: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 50/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

50

Appendix F (Think aloud test results)1 st tester:

Drags documents to page immediately. Quickly finds the languages – bituncertain about multiple parts of the fat drop down interface. Finds theprices and delivery dates of the documents fast and clicks pay. Able to solveall the tasks in an easy an fast way – finds needed features quite easy.Document interface: Quickly finds the log in top menu navigates to “dineoversættelser”. Able to navigate the interface but general implementationmay need improvements.

Comments: Likes the idea about drag and drop + simplicity and fast userinterface.

2 nd tester (English speaking tester):

Tries to search for the price as the very first thing. After some uncertaintiesgoes for the drag and drop. Finds the languages for the documents. Quicklyfinds the German language error.Document interface: Quickly finds the log in top menu, navigates to “dineoversættelser”.

Comments: Finds the interface easy to use.

3 rd Tester:

Drag and drops documents immediately. Finds languages immediately. Finds

prices and expected delivery dates quite fast. Quickly solves the rest of thetasks in an easy manner. Finds the German language error (after bit help).Document interface: Quickly finds the log in top menu navigates to “dineoversættelser”. Browses this interface for a bit until retrieving the documents– but no problems in finding various features and parts.

Comments: It’s a very easy user interface. Not room for much error. Wants tooknow what happens when you click the logo J

4 th Tester:

Drag and drop is the first thought to enter his mind. Quickly finds thelanguages, prices and estimated date of delivery. Are perfectly able to solvethe next tasks.Document interface: Quickly finds the log in top menu navigates to “dineoversættelser”. Looks around in the tabs until he finds the document.

Wants to click on the title of the document when trying to locate the contactperson.

Comments: Very straightforward. Difficulties when navigating and finding thedocuments.

5th

Tester:Clicks the logo as the very first thing. Hereafter clicks the UPLOAD FILESbutton and quickly chooses the files to be uploaded. Finds languageselection + price and delivery date fast. Finishes the following tasks easily.Finds German language error after some guidance.

Comments: There is a missing info button or close button in the multiplelanguage selection drop-down menu. Suggest an approval button forfinished documents.

Page 51: Bachelor Thesis - Just Translate

8/6/2019 Bachelor Thesis - Just Translate

http://slidepdf.com/reader/full/bachelor-thesis-just-translate 51/51

BA Web Development, Erhvervsakadamiet Lillebælt Morten Jonassen 3 rd Semester 2011

51

Appendix G (Logo sketches)