In order to recruit customers to WM3, the sellers of HL Design have for a while been wishing for a demonstration site. Therefore, this thesis and projekt goal have been to create such a site in WM3. WM3 is a CMS created by HL design and includes eleven different modules and features like; live editing, articles and calendars. The site will therefore include these modules that WM3 offers in except for two; the webshop and statistics-module. The site will also be user friendly, responsive, accessible, and it will be easy to navigate in it. Interest in WM3 has grown and grown during the project. The reason has been the ease and userfriendliness of WM3, both for developers and potential customers. As manager and developer of this thesis and projekt the tasks consisted of devoloping the site accourding to a plan and creating the plan to; demonstrate how the site should look like in terms of design, how the modules should be presented and how the structure of the website should look like. The result of this projekt and theises is a complete demonstration site for a fictitious law firm where all modules except the webshop and statistics, are used and presented. / För att rekrytera kunder till WM3 har säljarna på HL Design länge önskar sig en demonstrationswebbplats. Därför har detta examensarbetet gått ut på att skapa en sådan webbplats i WM3. WM3 är ett CMS skapat av HL design och innehåller elva olika moduler och funktioner som liveredigering, artiklar och kalendrar. Webbplatsen ska därför innehålla modulerna som WM3 erbjuder förutom två; webbshop och statistik-modulen. Den ska även vara användarvänlig, responsiv, tillgänglig och det ska vara enkelt att navigera i den. Intresset för WM3 har växt och växt under projektets gång. Anledningen har varit lättheten och användarvänligheten som WM3 har, både för utvecklare och potentiella kunder. Som ansvarig och utvecklare i detta examensarbete har arbetsuppgifterna bestått av att utveckla webbplatsen enligt en plan samt att skapa denna plan; för hur demonstrationswebbplatsen ska se ut designmässigt, hur modulerna ska presenteras och hur strukturen för webbplatsen ska se ut, samt utveckla webbplatsen efter planen. Resultatet av arbetet är en färdig demonstrations-webbplats för en fiktiv advokatbyrå där alla moduler, förutom Webbshop och Statistik, används

Studien sammanfattar uppbyggnaden av denna hemsida, där forskningen låg på att veta vilken typ av målgrupp som skulle besöka hemsidan med syftet att vara arbetssökande. Dessutom att ta reda på hur hemsidan skulle bli tilltalande genom att återspegla personlighet och emotion för målgruppen på ett tilltalande sätt. Studien genomfördes med hjälp av att ta reda på riktlinjer inom webbdesign, analysering av andras hemsidor tillsammans med information om målgruppen. Resultatet blev en färdig producerad hemsida som återspeglar personlighet och emotion till målgruppen på ett tilltalande sätt enligt riktlinjerna som följts med vissa avvikelser, samt att analyseringen tagits i åtanke till resultatet.

We’re all aware that technology progresses forward with giant leaps on a daily basis. Inone-way or another this affects us in our everyday life. It can affect us in the way we’re shopping, communicating, researching, planning future events or how we choose tobe entertained.That the web is an increasingly stronger tool for communicating in more or less everytype of business is becoming more evident for people. For the past few months I’vebeen working at Adamsson Appelfeldt Advertising in designing and developing a highlyinteractive website for a Swedish furniture company called Ragnars. By being involvedin the work process myself, I’ve tried to analyze how I, as an interaction designer, can improve it and make it work smoother for everyone involved. Maybe we can get amore distinct indication on when, where and how problems arise by letting users testthe website on a regular basis.In this report you’ll follow me through the design process, how I’ve involved users in theproject, and how I have evolved individually as an interaction designer.The help of using interaction design for creative solutions on the web and other areas of development online is definitely something that should be explored further.

[pt] Esta pesquisa tem como finalidade avaliar a usabilidade da navegação estrutural, também conhecida como Breadcrumb Trail, nome em inglês mais difundido. Este elemento representa o caminho percorrido pelos usuários até determinada página, provendo links que possibilitam voltar a páginas anteriormente visitadas. Existem diferentes tipos de utilização dos Breadcrumbs e sua eficiência será debatida durante o trabalho. A hipótese da pesquisa afirmava que a utilização da navegação estrutural auxilia a execução das tarefas de forma mais rápida, além de localizar melhor os usuários dentro da arquitetura da informação do website. Para que esta afirmação fosse verificada, foi adotada uma metodologia de pesquisa que envolveu questionários on-line e testes de usabilidade realizados em laboratório. No entanto, de forma a desenvolver um trabalho mais completo, as primeiras etapas do trabalho contaram com conceitos para embasar a pesquisa, abordando temas relacionados à  Interação Humano- Computador e à  Usabilidade. Após este levantamento, foi feita uma pesquisa de campo para que os Breadcrumbs fossem avaliados em termos de função e apresentação visual. Para a realização dos testes de usabilidade, foram desenvolvidos simuladores a partir do site do Banco Central do Brasil. Os testes contaram com a participação de 67 usuários, selecionados por um questionário online que contou com 450 respostas. Os resultados obtidos foram suficientemente esclarecedores. Os Breadcrumbs se mostraram eficientes em determinadas situações, e ineficientes em outras. Os resultados foram então generalizados com a criação de 6 guidelines de utilização do elemento. / [en] The goal of the research is to evaluate the usability of the structural navigation, also known as Breadcrumb Trail. This tool shows the path back to the pages previously visited by users, allowing them to link back to major categories of information. There are several different types of Breadcrumbs and efficiencies will be evaluated. The hypothesis affirmed that the structural navigation helps users browse and execute tasks faster, also providing some information such as where the users are located within the site. For that hypothesis to be verified, a research methodology has been adopted involving on-line questionnaires and usability tests. However, for developing a more complete work, in order to contribute for the improvement of Internet projects in Brazil, the first chapters were dedicated to subjects related to the Human-Computer Interaction and Usability issues. After this survey, a field research has been made so that the Breadcrumbs could be evaluated in terms of function and visual presentation. For the accomplishment of the usability tests, a prototype has been developed based on the Brazilian Central Bank`s website. The tests, wich counted with 67 volunteers, had been created in the Globo.com Usability Lab. The volunteers were chosen by the use of an on-line form. The results were acceptable, even though the Breadcrumb navigation was efficient in some situations and inefficient in others. The results has been generalized by the creation of six guidelines for using the element.

This thesis contains present trends in frontend web development. On the basis of this, there is made web application which is responsive a it is usable on mobile devices. In the theoretical part, there are described news and present trends of frontend web development and in the practical part, there is described whole process, which contains design, development, testing and deployment. This thesis could be very useful for beginners in the subject.

This Master thesis focuses on responsive web design. The main objective is to provide comprehensive view of the website created in so-called responsive realization, and impart awareness to readers not only about idea of responsive web design itself, but also about other ways of creating mobile webs. Furthermore, thesis deals with constructing of overview and comparison of selected technologies and frameworks with support of creating responsive websites. Every group of technologies or procedures is discussed in single chapter, to let reader simple and clearly return to particular concepts. After reading this thesis the reader should acquire not only detailed knowledge about responsive web design, but also suggestions and manuals for creating websites and for decisions in choosing the type of technology, which is possible to use to creating websites.

<p>På Linköpings universitet använder man sig sällan av versionshanteringssystem i kurser. Istället sparas till exempel programmeringslabbar på enskilda personers UNIX konton. Detta leder till problem både när man programmerar i grupp men också om någonting skulle gå snett. Labhandledaren har också mycket sämre vetskap om hur specifika gruppers arbeten framskrider och många grupper kan få hjälp för sent på grund av detta. Troligtvis kommer versionshanteringssystem användas mycket mer i framtiden.</p><p>Att läsa versionsloggar för att följa upp grupper är ett osmidigt och tidskrävande jobb och ger dålig överblick. Detta examensarbete beskriver ett verktyg till hjälp för labhandledaren i kurser där versionshanteringssystem används. Tillvägagångssättet och designen men även vilka problem som uppstod är fokus i rapporten.</p><p>Resultatet av examensarbetet är en webapplikation som visar statistik för alla labgrupper i en specifik kurs, både textuellt och grafiskt. Webapplikationen strävar efter att bete sig som en vanlig och lättanvänd skrivbordsapplikation. Detta verktyg ger labhandledaren bättre överblick över individernas arbete samtidigt som fusk kan komma att uppmärksammas.</p>

På Linköpings universitet använder man sig sällan av versionshanteringssystem i kurser. Istället sparas till exempel programmeringslabbar på enskilda personers UNIX konton. Detta leder till problem både när man programmerar i grupp men också om någonting skulle gå snett. Labhandledaren har också mycket sämre vetskap om hur specifika gruppers arbeten framskrider och många grupper kan få hjälp för sent på grund av detta. Troligtvis kommer versionshanteringssystem användas mycket mer i framtiden. Att läsa versionsloggar för att följa upp grupper är ett osmidigt och tidskrävande jobb och ger dålig överblick. Detta examensarbete beskriver ett verktyg till hjälp för labhandledaren i kurser där versionshanteringssystem används. Tillvägagångssättet och designen men även vilka problem som uppstod är fokus i rapporten. Resultatet av examensarbetet är en webapplikation som visar statistik för alla labgrupper i en specifik kurs, både textuellt och grafiskt. Webapplikationen strävar efter att bete sig som en vanlig och lättanvänd skrivbordsapplikation. Detta verktyg ger labhandledaren bättre överblick över individernas arbete samtidigt som fusk kan komma att uppmärksammas.

Speciale, Aarhus Universitet, 2005.

Zugl.: Wuppertal, Universiẗat, Diss., 2001 u.d.T.: Wenzel, Olaf: Aufbau und Nutzung von Internetsites.