28 Jan

So I have finally finished creating my web app for the chosen theme: Porsche. I am very happy with the final product, and feel that I have learnt a lot more than I intended that I would in the process. I have learnt mostly about jQuery mobile and the new lines of code that are available; as I had never used it before. I prefer making a mobile website this way, as opposed to relying on the normal code from a website but restricting the size, because you are given more responsive code which is great for smartphone devices, such as the buttons and lists; two features I have used a lot in my design.

Unfortunately I was not able to succeed in creating an additional version for the iPad/tablets, but this was due to  errors which I could not resolve. I wouldn’t want to pay for the apple license to host an app that will get taken down due to copyright reasons, and the embedding of a PDF file didn’t want to work. This is not an issue though as I have created a web app that i am happy with.

Is it better than Porsche’s current web app? I think it is, for the simple reason that it is more user friendly. Time and time again companies will create something that is standard for the industry, but it isn’t always the best decision. Here I have used a navigation based upon images, which allows the user to have less to navigate through, and is visually more appealing to them. As it is being viewed on a mobile I felt that the amount of text being viewed should be limited, so here I created many collapsible menus so that you can pick what text (if any) you wish to read. The intention of a car website is for quick viewing so you can look at the latest models, and read upon their top speed, horsepower etc. Naturally, there will be the “other” who will view these websites with the intention of buying, and for that I have included the prices, given contact information and optional information to read about the company.

I have tried to adopt to the style of Porsche’s own website with the navigation and design, but I wanted to do something different due to the fact that they already had a mobile version of their website. I haven’t included all of the cars because there are too many for me to avoid repetition in my design to show the overall design, however should this design become of a similar company or for them and wanting to use it for the full range, it would be easy to include the remaining pages. In my design I only chose 9 random cars, however for the full version I would pick one of each model that would act as the navigation picture, and upon pressing it there would be a pop-up menu that would list the models to choose from. I feel that this would be more user-friendly than a list of more lists that open when you choose one, to view the cars available. Mobile websites are all about being visually pleasing, and making it quick and easy to navigate without being bored, struggling to press the buttons or being lost in scroll-able areas of text. I was also going to include a custom icon for the iPhone’s “save to home screen  feature, however I felt that it would be needless as I never do it myself with websites and I don’t feel it would be worthwhile as it’s only one of the many phone brands out there that would have the personalized icon.

To conclude, I feel that my design was a success and fulfilled my initial ideas of the design outcome. I added and changed several things along the way, but for good intentions which in turn benefited the end creation of the web app. It has been a very reflecting assignment, and I have learnt a lot more about website coding from it, which will benefit me for future projects, and updating my own portfolio website. My concerns with the web app is my lack of knowledge in the field, but I have learnt a vast amount from not knowing anything about it, and feel that with more practice I could make something of a higher standard. I am glad that everything functions correctly, and I don’t think that looking back I would have preferred to have chosen a different form of interactive media, as this benefits me for promoting myself on different medias, and has taught me more about coding. has been a digital bible for me in my creation after following the “Dreamweaver CS5.5 Designing and Developing for Mobile with jQuery, HTML5 and CSS3” by David Powers, and showed me a lot of extra features that I have understood and integrated into my final product.

And finally, here is the web app (click the image to be redirected. If you are viewing on a computer or tablet you will be redirected to Porsche’s website and not the web app.)


Leave a comment

Posted by on January 28, 2013 in PCA - Interactive Design


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: