I arbetet undersöks hur olika animationstekniker på webben presterar utifrån mätningar av FPS och animeringstid. De tekniker som används är CSS3, jQuery och GreenSock Animation Platform. Arbetet är relevant då animationer på nätet blir allt vanligare och kraven på webbsidors snabbhet och respons samtidigt högre. Implementationen som mätningarna sker på består av en webbsida för varje animationsteknik innehållandes tre olika typer av animationer (övergångar, animationer av flera attribut och rotationer i 3D). Detta för att testa hur olika typer av animationer behandlas av de olika teknikerna. Vidare förekommer komplettering till mätningarna i form av användarstudier. Resultatet visar på att jQuery presterar sämre än CSS och GreenSock. De två sistnämnda håller liknande resultat men skiljer sig på specifika animationstyper. Arbetet är fullt återupprepningsbart och går i framtiden att utveckla på många olika punkter som t.ex. tillägg av fler tekniker eller testning på annan hårdvara.

This thesis has been performed at the system development company Verendus System AB, together with the home care company Basic Care Unit (BCU). The thesis has consisted of developing a web based informationsystem for BCU in which they can administrate their business. At the time of writing this thesis, BCU was using a windows-application to administrate their activities, which was both costly aswell as resulting in an unnecessary burden. The aim the thesis has thus been to create a platform-independent information system that simplifies and streamlines BCUs work by being user-friendly aswell as imposing some simplifying features. The students has been developing the system by the help of a work method they themselves developed. The method consisted of working in several iterations that each had several milestones. The method resulted in the students knowing easily when each iteration was finished or not. The thesis resulted in a working platform independent prototype. The prototype was developed in the PHP-framework CodeIgniter together with HTML5 and CSS3. Examples of functions included is being able to administrate BCU’s patients and employees, aswell as being able to plan the employees workdays with one click.

The focus of Master Thesis is on design and development of a web application. The application is used for archive and documents management in an organization. Thus, the main objective of the thesis is development of software for small and medium enterprises, which will help these organizations with their archives. Programming languages used in development phase are HTML, CSS, PHP jQuery and MySQL for database. The final software is universal and can be used in any organization.

Aim of the thesis is the analysis and design of parts Discount portal. Content of the work consists of two main parts, theoretical and practical. The theoretical part describes the analysis of Discount portal. Further work describes the behavior of discount portals and finally discusses the competitive discount aggregators and portals. The work is carried out detailed SWOT analysis portal, and also assessed the economic aspects and benefits of work. The practical part deals by itself parts Parts Discount website, its description and methodology of technology.

<p>Den här rapporten avhandlar framtagandet av en prototyp för en tjänst där abonnenter hos telekomoperatörer ska kunna beställa och konfigurera sina egna tjänster i betydligt större utsträckning än vad som är möjligt idag.</p><p>Detta är möjligt och önskvärt tack vare att det pågår kontinuerlig modernisering av den teknik som idag används i telefonnät och telefonsystem.</p><p>Projektet genomfördes på uppdrag av Tieto i Kalmar som är ett konsultföretag som arbetar mycket med telekomteknik och som har flera stora kunder som arbetar med modernisering av sin teknik.</p><p>Resultatet har blivit en prototyp där användaren på ett flexibelt sätt kan skapa, redigera och radera sina egna tjänster, samt få en grafisk överblick över sina inställningar.</p><p>Prototypen är också enkel för uppdragsgivaren att anpassa för demonstration för olika kunder. Den är dessutom anpassad så att det ska gå så enkelt som möjligt att utveckla den vidare med nya komponenter.</p><p>Från början ingick en student från Rehabiliteringsprogrammet i projektet. Tanken var att kunna genomföra olika typer av användbarhetsanalyser och på så sätt göra prototypen så användarvänlig som möjligt. Då studenten av personliga skäl inte fullföljde projektet redovisas dessa delar av projektet inte i den här rapporten.</p> / <p>This thesis treats the development of a prototype for a service where telecom customers can order and configure their own services to a much higher degree than what is possible today.</p><p>This is possible and desireble due to a continuing modernisation of the technology beeing used in the telecom systems today.</p><p>The project was coducted on the request of Tieto, Kalmar. Tieto is a consulting company that is highly involved in the telecom industry and has several customers that are working with modernisation their technology.</p><p>The result is a prototype called: ”Effect: a prototype for an Easy to use, Flexible, Figurative, Extenable Configuration Tool”. It´s a web application where the users in a flexible way can order, configure and delete their own services, and also get an graphical overview of their settings.</p><p>The prototype is easy for Tieto to adjust when showing it to different customers. It is also adapted in a way that it is easy to extend it with new components.</p><p>In the beginning the project included a student från the Interaction design program. The idea was to conduct a series of usability analysis and with the help of that being able to make the prototype as user friendly as possible. Since the student, for personal reasons, did not finnish the projet, this report will not present anything on that part.</p>

I detta dokument gestaltas arbetet med att utveckla ett internt administrationssystem till e-handelsföretaget Ehandelssupport. Detta är ett uppdrag i skarpt läge och grundas i företagets behov av att få bättre och mer användaranpassade webbapplikationer som syftar till att underlätta, förenkla och effektivisera vissa frekvent återkommande arbetsuppgifter. Detta innefattar exempelvis en applikation som kan generera prislappar baserat på produktinformation som lagras i webbshoppen Alfahobbys databas. Det inkluderar också en användarvänlig och effektiv lösning för att kunna skapa och skicka ut digitala nyhetsbrev till företagets kunder. Den färdiga applikationen för prislapparna uppfyller de grundönskemål om funktionalitet som företaget hade på denna samtidigt som den nya lösningen medför en rejäl tidseffektivisering i handhavandet med att skapa prislapparna eftersom datat hämtas direkt från databasen via ett nyimplementerat API. Applikationen använder också ramverket jQuery Mobile vilket stödjer responsiv webbdesign. Arbetet med lösningen för de digitala nyhetsbreven resulterade i ett förslag till företaget som innebär att börja använda verktyget Mailigen, detta skulle både förenkla det redaktionella arbetet och förbättra användbarheten för kunderna exempelvis genom att nyhetsbreven får en responsiv webbdesign. Några områden för eventuell framtida vidareutveckling är exempelvis att för applikationen för prislappar lägga till ytterligare kontroller som förhindrar att användaren skriver in fel värden i vissa funktioner. När det gäller nyhetsbreven skulle fortsatt forskning rörande möjligheten att kunna infoga produktinformation direkt från webbshoppens databas vara aktuellt.

Den här rapporten avhandlar framtagandet av en prototyp för en tjänst där abonnenter hos telekomoperatörer ska kunna beställa och konfigurera sina egna tjänster i betydligt större utsträckning än vad som är möjligt idag. Detta är möjligt och önskvärt tack vare att det pågår kontinuerlig modernisering av den teknik som idag används i telefonnät och telefonsystem. Projektet genomfördes på uppdrag av Tieto i Kalmar som är ett konsultföretag som arbetar mycket med telekomteknik och som har flera stora kunder som arbetar med modernisering av sin teknik. Resultatet har blivit en prototyp där användaren på ett flexibelt sätt kan skapa, redigera och radera sina egna tjänster, samt få en grafisk överblick över sina inställningar. Prototypen är också enkel för uppdragsgivaren att anpassa för demonstration för olika kunder. Den är dessutom anpassad så att det ska gå så enkelt som möjligt att utveckla den vidare med nya komponenter. Från början ingick en student från Rehabiliteringsprogrammet i projektet. Tanken var att kunna genomföra olika typer av användbarhetsanalyser och på så sätt göra prototypen så användarvänlig som möjligt. Då studenten av personliga skäl inte fullföljde projektet redovisas dessa delar av projektet inte i den här rapporten. / This thesis treats the development of a prototype for a service where telecom customers can order and configure their own services to a much higher degree than what is possible today. This is possible and desireble due to a continuing modernisation of the technology beeing used in the telecom systems today. The project was coducted on the request of Tieto, Kalmar. Tieto is a consulting company that is highly involved in the telecom industry and has several customers that are working with modernisation their technology. The result is a prototype called: ”Effect: a prototype for an Easy to use, Flexible, Figurative, Extenable Configuration Tool”. It´s a web application where the users in a flexible way can order, configure and delete their own services, and also get an graphical overview of their settings. The prototype is easy for Tieto to adjust when showing it to different customers. It is also adapted in a way that it is easy to extend it with new components. In the beginning the project included a student från the Interaction design program. The idea was to conduct a series of usability analysis and with the help of that being able to make the prototype as user friendly as possible. Since the student, for personal reasons, did not finnish the projet, this report will not present anything on that part.

Examensarbetet har utförts på Lawson, som idag gör en satsning mot de mobila användarna. Då det idag finns många olika typer av enheter, webbläsare och operativsystem utvecklas det mobila applikationer till varje plattform vilket medför stora kostnader och längre utvecklingstider. Den här rapporten är skriven i syfte att se över vad det finns för möjligheter att använda ny teknik som HTML5 och CSS3 tillsammans med ramverket jQuery for mobile för att utveckla webbapplikationer. För att visa på funktionaliteten och vad man kan göra så har två exempelapplikationer tagits fram och testas på flera olika plattformar/enheter, bland annat en iPad och en Samsung Galaxy Tab 8.9. Koden för dessa applikationer finns som bilaga i rapporten. Målet var att se över vad det fanns för stöd för swipes, enhetlig native-design/känsla, kunna använda enhetens kamera och GPS. En hel del, bland annat swipes, GPS och lokal lagring, går att lösa med HTML5 och jQuery for mobile. Men vill man komma åt ännu mer hårdvarunära funktionalitet, så som kamera, så behöver man lägga på ett ramverk, i mitt fall valde jag att utöka arbetet och även se över ramverket Cordova. Det ramverket gjorde att man kunde komma åt kameran i mobilen. Slutsatsen av undersökningen är att det går att göra mycket med jQuery for mobile som bygger på webbtekniker som JavaScript, HTML5 och CSS3. Men för att få hårdvarunära funktionalitet behövs det användas en annan typ av ramverk, t.ex. Cordova, som erbjuder ett API mot själva hårdvarufunktionaliteten. För att den funktionaliteten sedan ska fungera måste applikationen kompileras, på samma sätt som en native-applikation. Dock så använder Cordova samma teknik som ramverket jQuery for mobile, så kostnader och utvecklingstid kan hållas nere. Vid små applikationer fungerar det utmärkt att använda denna teknik men vid större kan man behöva göra lite fler prestandatester innan man säkert kan avgöra om tekniken är lämplig.

This report deals with the creation of Habit's website, which is aimed at private customers, habitsapp.eco. Habits is a small company in Gothenburg and they want to help companies, organizations and individuals to reduce their environmental impact in an easy and fun way. They have developed a web-based tool for this that will be launched in the fall of 2020 and the website created will be their "face out" for the tool aimed at private individuals. The report describes the steps and tools that were made and used to create this site. User stories have been made to get to know the user and identify their needs, sketches of the website have been made to easily illustrate how the site would look like and a sitemap has been created to know which pages the project should contain. How the creation has been done from HTML to Twig and the functionality behind things like menu, questions and answers section, support for multiple languages etc. Is brought up. In addition to this, tests have also been done by both me and my supervisor at Habits. Various tools have been used to ensure that the load time remains within an approved framework and tools such as the WAVE Evaluation Tool have been used to ensure the availability of the site. In the end, there is a finished product that fulfills Habit's purpose and hopefully is representative of their service and can draw users into their web-based tools. / Denna rapport behandlar skapandet av Habits webbplats som riktar sig till privatkunder, habitsapp.eco. Habits är ett mindre företag i Göteborg och de vill hjälpa företag, organisation och privatpersoner att minska sin miljöpåverkan på ett lätt och roligt sätt. De har utvecklat ett webbaserat verktyg för detta som kommer lanseras hösten 2020 och webbplatsen som skapas kommer vara deras ”ansikte utåt” för det verktyg som är riktat till privatpersoner. I rapporten gås det igenom vilka steg och verktyg som gjorts och använts för skapandet av denna webbplats. User stories har gjorts för att lära känna användaren och identifiera deras behov, skisser över webbplatsen har gjorts för att enkelt kunna illustrera hur webbplatsen skulle se ut och en sitemap har skapats för att veta vilka sidor projektet skall innehålla. Hur skapandet har gjorts från HTML till Twig och funktionalitet bakom saker som meny, frågor och svar-sektionen, stöd för flera språk mm. Tas upp. Utöver detta har också tester gjorts av både mig och min handledare på Habits. Olika verktyg för att säkerställa att laddningstiden håller sig inom en godkänd ram har gjorts och verktyg som WAVE Evaluation Tool har använts för att säkerställa webbplatsens tillgänglighet. I slutändan finns en färdig produkt som fyller Habits syfte och förhoppningsvis är representativ för deras tjänst och kan dra in användare till deras webbaserade verktyg.

Idag utförs arbete ofta på resande fot och då används smarta telefoner och surfplat- tor istället för datorer. Dessa skärmar är oftast mindre än vad en datorskärm är. Där- för efterfrågas en mer dynamisk design av webbsidor som anpassar sig till storleken på skärmen. Webbsidans statiska design var 1000 pixlar bred och innehöll många tabeller vilket skulle få plats i den dynamiska designen med en minsta bredd på 320 pixlar. En del viktig information behövde även lyftas fram och göras tydligare. Det implementerades en ny CSS-mall samt flera nya JavaScript. En del HTML justerades för att passa den nya CSS-mallen. Eftersom en del viktig information behövdes pre- senteras tydligare skapades en helt ny flik. Innehållet blev driftinformation relaterat till den inloggade kunden. Efter simuleringarna i Chrome verifierades responsivite- ten av sidorna på alla skärmstorlekar. Implementeringen av AJAX gjorde att de lång- samma sidorna svarade direkt, men förbättrade inte den totala laddtiden. För att förbättra den skulle en back-end optimering behöva utföras. Projektets webbsida fu- gerade enligt önskemål. / In today ́s society people are working more and more while travelling, which makes them use smartphones and tablets instead of laptops. These screens are usually smaller than a laptop screen. That is why a more dynamic web design has been re- quested in order to fit the screen on the device being used. The static webpage’s width was 1000 pixels and the goal was to fit all the tables and information in the respon- sive version with a width of 320 pixels. Important information also had to be moved to a different page in order to make it more visible. A new CSS-template was imple- mented and several new Java Scripts followed by finer adjustments to the HTML code. Since some information had to be more visible to the user, a new tab was cre- ated in order to fulfill this demand. The new tab contained information about “Net- work Status” only related to the signed in user. After simulating the webpage in Chrome the responsiveness of the page was confirmed on all screen sizes. Sending the webpage asynchronously made the slow pages respond instantly but the total loading time was still slow. To fix this, back-end programming would have been re- quired. The project’s webpage fulfilled all the requirements.