There has recently been an emergence of new devices in which users can access the web. These devices have significantly smaller screen sizes than the more common desktop. This results in that the approach to designing web content has to be changed. The approach to design web content that adapts its visual layout to different screen sizes, is referred to as Responsive Web Design. Ida Infront is a company that develops systems and solutions for informationintensive businesses. They are currently examining how to design a layout editor that can be used to define responsive design for web-forms. The purpose of this project is to design and implement a prototype of such a layout editor, which will then be evaluated by Ida Infront. The project is divided into two phases, starting out with the research process, followed by the prototype design process. In the research process, the following is examined: structure of the XML file describing web-forms, Responsive Web Design techniques and technologies appropriate for the layout editor. In the prototype design process, a layout editor prototype allowing responsive design for web-form components, is designed and implemented. The responsive design configuration is added to the web-form XML file. We found that Bootstrap is a suitable technology to define responsive design of web-forms, since placement of web-form components can be translated into a Bootstrap grid system. The resulting layout editor prototype allows responsive configuration in Bootstrap. This is done by utilising the grid system as the underlying structure for placement of web-form components. The prototype also allows configuration for each of the four Bootstrap device classifications, named xs, sm, md and lg. Position and size of webform components are stored for each Bootstrap device classification. The resulting responsive configuration is added into the existing XML file for the web-form. / Den senaste tiden så har det uppkommit nya enheter som man kan komma åt webben med. Dessa enheter har betydligt mindre skärmar än de mer vanliga stationära enheterna. Det har resulterat i att sättet man designar webbinnehåll måste ändras. Metoden att designa webbinnehåll så det anpassar sin grafiska utformning efter olika skärmstorlekar kallas för responsiv webb design. Ida Infront är ett företag som utvecklar system och lösningar för informationsintensiva verksamheter. De undersöker just nu hur man designar en layout editor som kan användas för att definiera responsiv design för webb-formulär. Syftet med detta projekt är att designa och implementera en prototyp av en sådan layout editor, som sedan kommer utvärderas av Ida Infront. Examensarbetet är uppdelat i två faser, det inleds med forskningsfasen och efterföljs av prototypfasen. I forskningsfasen undersöks följande: strukturen i XML filen som beskriver webb-formulär, olika tekniker för responsiv webb design och lämpliga teknologier att använda i en layout editor. I prototypfasen, designas och implementeras en prototyp som gör det möjligt att definera responsiv konfiguration för webb-formulär. Konfiguration för responsiv design läggs till i den befintliga XML filen. Vi kom fram till att Bootstrap är en lämplig teknologi för att definera responsiv design för webb-formulär. Eftersom placeringen av komponenter i webb-formulär kan översättas till Bootstraps rutnät. Den resulterande layout editorn gör det möjligt att definera responsiv design i Bootstrap. Detta genom att använda Bootstraps rutnät som underliggande struktur för placering av webb-formulärets komponenter. Prototypen gör det också möjligt att konfiguera för var och en av de fyra Bootstrap enhets klasserna, namngivna som xs, sm, md och lg. Position och storlek för webb-formulärets komponenter lagras för varje Bootstrap enhets klass. Den resulterande responsiva konfigurationen läggs till i den befintliga XML filen för webb-formuläret.

This paper aims to examine what the differences is between the three application types, native, hybrid and web. The main focus will be placed on the web app and investigate whether it could be an alternative to native and hybrid app. To explain what a web app has the capacity to do, a web app is created in wordpress. Web development is moving forward, which is obviously positive. The problem may be, however, for companies that come from a completely different industry and who wish to develop a new web solution for their company. A native app can be a very expensive investment and it is far from all companies that can pay this. This study wants to find out if a web app, could be an alternative to the native app. Furthermore, the report will examine what the possibilities are for a web app and what existing web apps there is today. Furthermore, a simple price comparison between the different app types to be made. / Den här rapporten syftar till att undersöka vad skillnaden är mellan de tre applikationstyperna, native, hybrid och webb. Störst fokus kommer att placeras på webb appen och undersöka om denna skulle kunna vara ett alternativ till native och hybrid appen. För att redogöra vad en webb app har kapacitet att göra kommer en webb app att skapas i wordpress. Webbutvecklingen går framåt vilket självklart är positivt. Problemet som kan bli är dock för företag som kommer från en helt annan bransch och som önskar ta fram en ny webb-lösning för sitt företag. En native app kan vara en väldigt dyr investering och det är långt ifrån alla företag som kan betala detta. Denna undersökning vill reda ut om en webb app kan var ett alternativ till native appen. Vidare kommer rapporten undersöka vad det finns för möjligheter för en webb app och vad det finns för webb appar idag. Dessutom kommer en enklare prisjämförelse mellan de olika apptyperna att göras.