FINAL MAJOR PROJECT RESEARCH (BA HONS) FASHION MEDIA

Page 1

ANNALEA KU BA(HONS) FASHION MEDIA

ANNALEA ‘ANNA’ KU FASHION MEDIA YEAR 4 FINAL MAJOR PROJECT STUDENT ID: KU_11321388 #researchdossier


ANNALEA KU BA(HONS) FASHION MEDIA

My Research dossier displays my final major project journey by looking at digital website and mobile applications as an area study. By studying this subject I have decided to create a website and website application as my final product called ‘FileofStyle’. This website is based around the collaboration of fashion instagrammers and the term ‘social shopping’. Instagrammers are becoming ‘insta- famous’ by posting their outfits on their pages everyday, which then gives them exposure by hashtags and likes. By becoming insta famous this shows how user generated content is so popular and inspires the consumer by them wanting the content that is posted. I have taken inspiration from this and have created a website and application based on a “steal their style” idea. Our society has now moved from the celebrity steal their style culture to the vast popularity of social bloggers. Our website creates the notion of merging social media into shopping; the newly derived term called “social shopping”. The consumer can go onto the website and see the fashion instagrammers outfits, they can then click on every garment shown which then takes them to the retailer in order for the consumer to buy. Once they have brought their outfit inspired by the instagrammer, this will then be shared via instagram with a selfie hashtagged #ivebeenfiled. This in favour creates more exposure to the website but also to the brands themselves. This research dossier displays my ideas, primary and secondary research and shows how I got to making and branding my website and app “FileofStyle”


ANNALEA KU BA(HONS) FASHION MEDIA

INTERNET AND WORLD WIDE WEB - everyday usage - online shopping - online consumer - access via computer, ipad, iphone, android

MOBILE APPS - mobile marketing is increasing -social media pplications prove to be most popular - QR codes

DIGITAL PC/ LAPTOP are the most popular followed by Mobile devices COMPUTERS, IPADS, IPHONES

FINAL MAJOR PROJECT PRODUCT IDEA Website and application for web and mobile WEBSITE- MOBILE ORIENTATED? CHEAPER? EASIER? WEB APP VS MOBILE APP

DIGITAL TRENDS ARE RISING SIGNIFICANTLY IN 2015


ANNALEA KU BA(HONS) FASHION MEDIA

PROS

A mobile app is a software application developed specifically for use on small, wireless computing devices, such as smartphones and tablets, rather than desktop or laptop computers.

-Since native apps work with the device’s built-in features, they are easier to work with and also perform faster on the device.

-Native apps tend to be a more expensive proposition to the developer. This is especially the case for developers who would like their app to be compatible with multiple mobile devices and platforms.

-Native apps get full support from the concerned app stores and marketplaces. Users can easily find and download apps of their choice from these stores. -Because these apps have to get the approval of the app store they are intended for, the user can be assured of complete safety and security of the app. -Native apps work out better for developers, who are provided the SDK and all other tools to create the app with much more ease.

CONS -The cost of app maintenance and app updation is also higher for native apps, especially if this app supports more than one mobile platform.

NATIVE APPS (MOBILE)

-The process of getting the app approved at the app store can prove to be long and tedious for the developer and need not always result in success. Also, there is no guarantee that the app becomes instantly popular with users. -Users of different mobile devices may be using different versions of the app, which makes it difficult for the developer to maintain and offer support.


ANNALEA KU BA(HONS) FASHION MEDIA

PROS

A web application or web app is any computer program that runs in a web browser. It is created in a browser-supported programming language (such as the combination of JavaScript, HTML and CSS) and relies on a web browser to render the application.

CONS

-Web apps are much easier to maintain, as they have a common code base across multiple mobile platforms.

-Mobile Web apps only have limited scope as far as accessing a mobile device’s features is concerned.

-Web apps can be manipulated so as to be made compatible with any older mobile device.

-Web apps that support multiple mobile browsers can prove to be an expensive proposition for developers, as it raises the costs of developing and maintaining them.

-Web apps do not require developers to submit their app to any app store for approval. Of course, the Apple App Store does feature a list of Web apps. -Since Web apps do not need to be approved by the app marketplace, they can be released at any time and in any form, as per the developer’s preferences. -Users need not bother with visiting an app store to download Web apps or updating the same on their mobile devices.

WEB APPS

For my project, I feel a web application will be much more feasable than a native app due to cost, however in a future plan for my project I would love to create a distinctive mobile app when money is available via website/ web app.

-Different users work with different mobile browsers. This can make it difficult for you to maintain a record of their usage patterns and also provide support for all of them. -Users may sometimes find it difficult to discover a Web app, as it is not systematically listed in any app store. -Since there is no regularized quality control system for Web apps, users may not always be guaranteed safety and security of the app.


ANNALEA KU BA(HONS) FASHION MEDIA

Visitors Keywords need to be researched and selected so that you can rank highly in Google and attract visitors to your website. This means research, back linking, article writing and content curation to ensure you have the right content to attract visitors attention. Go live Someone has to buy your domain name, install your site on a hosting server, set up the DNS, get your analytics, webmaster tools and sitemaps and make sure everything is working.

Social media

Mobile

Successful online businesses will leverage social media including Facebook, twitter and Google+. So someone needs to integrate your social media accounts into your website and create easy methods to share your content with others.

Visitors to your website using mobile devices such as tablets and smartphones will soon make up the bulk of the people looking at your website. This means someone has to ensure your website looks good on different sized screens while still being able to be read and used properly.

Compatibility

Pictures Regardles of wether you have your own photos, need them taken, or simply want to use stock images they still have to be resized, retouched, and organised.

WEBSITE BUILDING

Design

Text It doesn’t matter if you write the copy yourself or hire a specialised copywriter the text still needs to be collated, spell-checked, proof read before it can be used. Structure and Conversion

Coding

There needs to be some thought put into choosing colours, fonts and graphics so they work with your brand and match your other marketing collateral.

Someone has to think about pages, navigation and usability, and the best way to get users from here to there. Once visitors get to your website the content needs to styled so that it persuades them to take action on your website – buy that widget, fill in that form etc.

There are dozens of different web browsers that run on Macs and PC’s that all need to display the website without a glitch. This means coding, testing and fixing all of the issue to provide the best experience for visitors – regardless of what they use.

Page Layout The location of headers, footers, sidebars opt-in boxes, and social media icons need to be decided to provide the best possible chance of converting visitors into clients.

Your website will need good quality code that works quickly and doesn’t crash causing errors, or breaking your website completely.


ANNALEA KU BA(HONS) FASHION MEDIA

WEBSITE COSTINGS Up to £3,000 This would be the price point that most startups would aim at. An example of a basic website is one built on WordPress or a similar content management system with a customised theme. The use of plugins means that the functionality can be added quickly and inexpensively. What you get: Basic customisation of an existing theme branded to your company requirements based on WordPress, Joomla or another CMS framework Content and image sliders Contact forms Opt-in forms Photo galleries Social media integration Blog Basic keyword optimisation Cross browser compatibility Sitemaps What you won’t get: Copywriting or content creation Photography and video Branding or a logo Search Engine Optimisation Keyword research and content optimisation In-depth conversation optimisation E-commerce or shopping cart custom coding or functionality Integration to back office systems


ANNALEA KU BA(HONS) FASHION MEDIA

£5,000 to £10,000 Using a custom website you can expect more customised functionality that is tailored to your exact needs. You can also add in keyword research and basic search engine optimisation. You may also get some copywriting to ensure you get the correct message over to your target market. What you should expect: A fully customised theme branded to match your corporate identity based on WordPress, Joomla or another CMS framework Content and image sliders Basic e-commerce or shopping cart functionality Contact forms Opt-in forms Photo galleries Social media integration Blog Basic keyword optimisation Cross browser compatibility Responsive design so your website works properly on tablets and smartphones Sitemaps Search Engine Optimisation Keyword research and content optimisation Copywriting or content creation What you won’t get: Photography and video Branding or a logo In-depth conversation optimisation custom coding or functionality Integration to back office systems


ANNALEA KU BA(HONS) FASHION MEDIA

HOW TO BUILD A BASIC WEBSITE

1- DOMAIN NAME Your domain name is the name of your website. It doesn’t have to be your company name but it needs to be relevant, easy on the eye and simple to remember. Not only does it make it easy for potential customers to find your firm, and allows you to showcase your goods or service via anything from a full-blown online store to a simple online business card, with your contact information, hours and location. How you choose your domain name depends on where you are with your business. If you’re already up and running, you’ll want to choose a domain that comes to close to matching your business name, or alternatively what you do 2- CHOOSE A SITE TO DESIGN WEBSITE ON There are a vast number of DIY website building sites online. Go Daddy, Moonfruit and SiteBuilder are all decent options, although each have their pros and cons. Alternatively, SquareSpace is more aimed at people with businesses needing a designer, stylish or image heavy look, for example clothing, food, small B&Bs or restaurants. Weebly, on the other hand, is a good option for those that need a decent mobile app offering. There is no right or wrong service to use, but some are certainly better than others. Do a bit of research and decide which layouts you prefer. If you know someone that has built a website, talk to them about the process - recommendations can be invaluable. 3- FIND A COMPANY TO HOST A website needs to be hosted on a web server in order to make it accessible to users via the internet. Hosting involves housing, serving and maintaining files so that your potential customers are able to view the site contents - essentially it acts as the gateway between your website and the web itself. If you have gone for a DIY template, the company will usually provide a hosting service, too, this may be included in the price or free or you may have to pay extra. This is typically a set amount per month or per year. Alternatively you can buy a hosting service from a separate company if you like. Those that have built their own website obviously need to pay for a hosting service, too. There are plenty of companies that provide free hosting space – BT and Google are just two. However, free services may have limited facilities. A decent paid-for hosting service starts at around a few pounds per month, if you want more bandwith for high traffic or extra bells and whistles it will cost more. This will be on a web server shared with other websites. If you don’t want to share, your own web server starts at around £60 a month. Domain name registration and hosting can usually be set up through the same company.


ANNALEA KU BA(HONS) FASHION MEDIA

HOW TO PROMOTE A WEBSITE Once your website is up and running you need to get people to visit it. There are various ways to attract viewers to your site – linking to the URL, entering specific terms into an internet search engine, pay-per-click or via links from other sites. Google works by crawling an enormous amount of webpages, which contain links to other websites. As this process gets replicated over time, it can begin to build a picture of what the web looks like, and relationships - or links - between different websites. As Google builds up its archive of information, it has algorithms to calculate various ranking factors which will affect how websites are displayed in the search engine results pages (SERPs). These include number of linking root domains to the site, quality of websites linking, anchor text, freshness and many more factors (in fact there are over 200 factors and no-one knows exactly how Google weights each of these, as their algorithm is constantly changing over time). Using keyword research - should naturally try to include relevant terms within webpages, keeping key products or services with their own unique page. Google’s Keyword Tool is great for this and finding search volume for the most relevant terms to target. -Page titles should be keyword focused and for best practice, kept under 65 characters. -To see how your website appears to Google’s users, have a look at this SERP Snippet Tool: http://www.seomofo.com/snippet-optimizer.html If your website has broken links and other errors, Google will not be able to crawl and index your website correctly. Make sure they are all returning 200 response codes in the Screaming Frog Spider Tool http://www.screamingfrog.co.uk/seo-spider/ for example.

Links -Links are a key factor to determining search engine rankings. Attracting links to your website is not an easy task, and there are many different techniques and link building philosophies. Google is constantly tweaking and updating its ranking algorithm, which means what might work one day, may completely change the next. -Think about each link as a vote of confidence to the search engines – the more ‘votes’ you have, the more trusted and relevant your site is, therefore the higher you will appear in search results. -The caveat to this is of course that the more reputable the site, the more weight and trust a link carries – so a link from the BBC is going to be worth a lot more than a link from a small blog with practically no readers (and as such a link from the BBC is infinitely more difficult to acquire!) If you have any pre-existing relationships with trade associations or suppliers, these could be potential quick wins for getting your site referenced. -Local business websites, business directories and news sites should be used to your advantage too. Local news sites are great as other blogs and news sites use these sources for their own news content.


ANNALEA KU BA(HONS) FASHION MEDIA

A blog -Having a blog on your site is useful for a few reasons. As well as getting people talking about you and linking to your site, it gives you an opportunity to publish news stories, pieces of content and insert a little more personalisation to your site, that your other pages might not be able to do. -While updating the blog regularly is important, quality is much more important than quantity - one great blog post a month is better than four poor ones. You can also blog externally for other websites too, which will help grow your brand and also assist with link building.

Content creation -If you have access to exclusive resources, make use of them. If you have undertaken surveys, use the aggregated data. Should you have the means available to publish these (on a blog, perhaps?), they can lead to links back to your site. Better still, why not publish an infographic? People love these as they serve as a visual aid as opposed to just publishing a table of statistics.

Social media Google Plus, Twitter, Facebook and many other social channels are great to utilise. They can get people sharing your blog posts, pictures, comments. Whatever it might be, social media enables you to interact with potential and existing customers who will hopefully start talking about and engaging with you.


ANNALEA KU BA(HONS) FASHION MEDIA

BASIC FASHION WEBSITE CASE STUDY 1: Frank & Doll are a fashion boutique in London who wanted a website to support their brand. With the rise of e-commerce the company needed an intergrated content management system to support their log in files and databases. Although sounds complex, this proved to be quite basic to design. The company float charged them £1,000 for what would be a £5,000 design development. FEATURES: -CMS System -A visual magazine style ‘look book’ -Social media links

A Lookbook is something that I will want to include in the website.


ANNALEA KU BA(HONS) FASHION MEDIA

BASIC FASHION WEBSITE CASE STUDY 2:

Luva Huva is a lingerie boutique based in London who wanted a website to establish themselves as a Top worldwide lingerie fashion brand LuvaHuva required an Ecommerce system that would grow with the company and allow for complete sales management and integrated online marketing facilities. The designer created an elegantly designed website that positions the company inline with other top fashion designer online retailers. The site includes the ability to: -Up-sell and cross-sell products using its built in recommendation engine based on related products, -Product filtering -The ability to add and redeem promotional voucher codes -All products display multiple views and the ability to zoom -Product pages include integration of Facebook’s ‘Like’ button to encourge sharing amongst Facebook users


ANNALEA KU BA(HONS) FASHION MEDIA

WEB APP CASE STUDY 1: “We didn’t just want to build a product that fulfilled its current requirements; we wanted to build a foundation that we could innovate on in the future. This meant building with a maintenance-first mentality, writing clean, well-commented code and, at the same time, ensuring that our code could accommodate the demands of an ever-changing feature set.” http://www.smashingmagazine.com/2013/05/23/building-the-new-financial-times-web-app-a-casestudy/ The financial times wanted a web application to support their newspaper. This case study shows the transition, from reading this study it’s clear to see that making a traditional form of media into modernized technology is quite difficult. The most important point I got from this case study was the fact that visuals are what makes user engagement.

With the extend of tech- ipad, iphone, iwatch a retina screen for a web app is very important as the content will be viewed from various digital devices.

IMAGES Article images are crucial for user engagement. Our images are delivered as double-resolution JPEGs so that they look sharp on Retina screens. Our image service (running ImageMagick) outputs JPEGs at the lowest possible quality level without causing noticeable degradation (we use 35 for Retina devices and 70 for non-Retina). Scaling down retina size images in the browser enables us to reduce JPEG quality to a lower level than would otherwise be possible without compression artifacts becoming noticeable. This article explains this technique in more detail. It’s worth noting that this technique does require the browser to work a little harder. In old browsers, the work of scaling down many large images could have a noticeable impact on performance, but we haven’t encountered any serious problems. Native-Like Scrolling Like almost any application, we require full-page and subcomponent scrolling in order to manage all of the content we want to show our users. On desktop, we can make use of the well-established overflow CSS property. When dealing with the mobile Web, this isn’t so straightforward. We require a single solution that provides a “momentum” scrolling experience across all of the devices we support. OVERFLOW: SCROLL The overflow: scroll declaration is becoming usable on the mobile Web. Android and iOS now support it, but only since Android 3.0 and iOS 5. IOS 5 came with the exciting new -webkit-overflow-scrolling: touch property, which allows for native momentum-like scrolling in the browser. Both of these options have their limitations. Standard overflow: scroll and overflow: auto don’t display scroll bars as users might expect, and they don’t have the momentum touch-scrolling feel that users have become accustomed to from their native apps. The -webkit-overflow-scrolling: touch declaration does add momentum scrolling and scroll bars, but it doesn’t allow developers to style the scroll bars in any way, and has limited support (iOS 5+ and Chrome on Android).


ANNALEA KU BA(HONS) FASHION MEDIA

WEB APP CASE STUDY 2:

An example of another wbsite which has gone into an applicationIPAD - the aim was to produce a touchscreen experience and let the viewers be in the driving seat of the show. -By having an application as another option makes the brand a whole lot diverse.

Design process: sketches used to see what it would look like on a screen, something that I will do in the enxt stage of designing my web app.


ANNALEA KU BA(HONS) FASHION MEDIA

STRATEGY AND DESIGN:

1-Before jumping into design, it’s important to carefully map out all of the content, and define two critical components: Wireframes and Site Map. The driving principles for the project revolved around a smooth browsing and purchase experience, so they focused tightly on the artful meshing of content and commerce. 2- Evidently placed- the design planning stage is thoroughly important, but also makes life a lot easier for the person devloping the application. 3- Simple and sleek designs are always better than complex and overloaded with information.


ANNALEA KU BA(HONS) FASHION MEDIA

MERGING THE SOCIAL WITH WEB CASE STUDY

This case study blurs the boundary between social and web. Messages for Japan was a design based around sending love after the earthquake massacre. The whole world united on this website by typing messages in their language which translated to Japen using a multi language channel- google translate. Social media is something that is going ot be widely featured in my web app


ANNALEA KU BA(HONS) FASHION MEDIA

Every design element relates to the subject matter, it tells a story- something that I need to think about hwen designing my web app.

By Sharing the message on twitter and facebook, the message was spread around the world which encourages people to get more involved. Word of mouth and the power of social media is very relevant when looking at the connection between web and social.


ANNALEA KU BA(HONS) FASHION MEDIA

SOCIAL AND WEB- PINTEREST CASE STUDY

Pinterest is a fantastic example of a company who blurs social with ecommerce. Companies can make their own mood boards on the site and then share them via twitter and instagram. This is the element that I want to include in my website/ web app


2. Design -Wireframe and design planning - the visual layout of the website begins to take shape -Mock-ups - allows for relatively easy modifications -Review and approval cycle - reviewing, tweaking and approving the mock-ups (the time to make changes, not after the design has been coded)

4. Testing

8. Post-launch

-Test links and functionality - walk through every single page created -Testing - final diagnostics using the available tools: code validators, broken-link checkers, website health checks and spell-checker -Cross-Browser Checking - Checking that site works in multiple browsers like IE, Firefox, Chrome, Safari, Opera, iPhone, BlackBerry

-Provide documentation and source files -Providing the client with documentation for the website, a soft-copy site map and details on the framework and languages used -Project close, final documentation - the client signs off on the last checks, provide your contact information for support, and officially close the project.

6. Refinement Fine Tuning - identify parts of the website that could be improved in small ways

1-2 weeks

ANNALEA KU BA(HONS) FASHION MEDIA

WEBSITE PRODUCTION TIMELINE

1. Planning

5. Release 1

-Requirements analysis - client goals, target audience, detailed features -Site map -Contracts - Project closure clauses, exit clauses, copyright ownership & timelines Required Resources - software, stock photography, fonts, etc

-Inspection - Client given access to front & backend of website -Collaboration - discuss functionality and direction of website with client 3. Development -Build development framework - ensures that the server can handle the installation and set-up smoothly -Code templates for each page type - (e.g. home, general content, blog post, form) -Develop special features and interactivity - where the fancy elements come into play -Populate with content - loading all of the content provided by the client or writer

7. Launch -Upload to live server - transferringfrom test server to the live web server -Hand site over to client - all contractual obligations have been met and the client is satisfied with the product


1-Planning- what exact features are going into website, how to blend social media into website, look at specific designs

1-3 weeks

3-Research content- look at instagrammers, fashion bloggers, social media links

1-3 weeks

1-3 weeks

4-Design- how the website/web app will look, implement the colour and text and branding of the website, design a logo

1-3 weeks

2-Architecture- look at wireframe, design, features, interfaces, colour.

1-3 weeks

ANNALEA KU BA(HONS) FASHION MEDIA

PRE PRODUCTION TIMELINE

5-Development- Coding of application; navigation, user interaction, database integration, web services, ecommerce platforms

TOTAL TIME PREDICTED: 3 MONTHS


ANNALEA KU BA(HONS) FASHION MEDIA

1: PLANNING

Rough design sketches just to show how i want the website to look - Sign in with social media? or just have the consumer view the website - tabs such as ‘whats hot’ and ‘lookbook’ - I took inspiration from pinterest for web design, I liked how it’s simple but effective.


ANNALEA KU BA(HONS) FASHION MEDIA

Looking at designs in my planning of web design- I love Missguided’s simple box designs- really simple but effective to the screen. I want a box design to be predominant on my site, but also for it to be quite interactive.


ANNALEA KU BA(HONS) FASHION MEDIA

FILEOFSTYLE What is fileofstyle? FileOfStyle is a fashion and lifestyle website founded by Anna Ku @avku, her enthusiasm for digital fashion, media and styling has inspired her to create a unique and dynamic website to fulfill the fashionistas needs! ‘Blogging, vlogging and gramming’ are all terms that have been coined by the use of social media in todays modernistic climate. By taking this on board, FileofStyle have derived a website that features popular fashion instagrammers and their stylish outfits. However, the question is- Where did they get that outfit from? By featuring current trendsetting instagrammers, FileofStyle then log their outfits and scour the web to see where they got the particular outfit from which gives you the opportunity to buy the outfit by clicking the shop now link! FileofStyle is also available as an app on iphone Why File of style? It’s catchy and goes with our idea of creating a file of epically dressed stylers for people to take inspiration from and file ideas into their closets!


ANNALEA KU BA(HONS) FASHION MEDIA

2: ARCHITECTURE I’ve been putting together my wireframes for the website, wireframes are important because they make the whoe design of the website and framework to make it actually work. I made the wireframe on indesign and then coded it.


ANNALEA KU BA(HONS) FASHION MEDIA

Having a wireframe template helps me also to plan out what is going on the website. It’s a good resource to have if I need reference.


ANNALEA KU BA(HONS) FASHION MEDIA

This POP code is used to actually make a template web design. i used this to design my final website.


ANNALEA KU BA(HONS) FASHION MEDIA

2: RESEARCH CONTENT The main content to the website/ web app is instagrammers so first of all I had to research how instagram uses ecommerce as a marketing device

I’m using Instagram as a tool to ENGAGE with the consumer which is one of their marketing strategies that is used today.


ANNALEA KU BA(HONS) FASHION MEDIA

“The trend of 2015’” in e-commerce, looking at the graphics, facebook is number 1 with the most number of online sales coming from them

‘SOCIAL SHOPPING’

In terms of fashion e- commerce, polyvore takes the most revenue followed by instagram. Instagram will be the main source of traffic to my website.


ANNALEA KU BA(HONS) FASHION MEDIA

TARGET MARKET

Survey produced by surveymonkey.com produced these results


ANNALEA KU BA(HONS) FASHION MEDIA

SWOT ANALYSIS- WEB STRENGTHS -A good web system -Theres normal people no celebs, catered to the consumer - easy navigation -good social media links

OPPORTUNITIES - customer loyalty, alway slooking for new clients and love feedback -room to grow -massive gap in the market for us as a brand and as a social shopping website

WEAKNESSES - lack of funding to produce more interactive gadgets - No reputation behind our brand - need to manually change trends and collaborations

THREATS - Instagram becoming extinct -No bloggers wanting to collaborate -System host goes down - Competition from other websites that are coming into action with the ‘social shopping’ trend.

?!


ANNALEA KU BA(HONS) FASHION MEDIA

‘INSTA- FAMOUS INSTAGRAMMERS’

Explains how the shift form celeb filled culture has turned to normal people who get popular by likes from other people creating a massive buzz


ANNALEA KU BA(HONS) FASHION MEDIA

THE INSTA FAMOUS @ fa s h i o n a b l y ka y

Makayla McAfee aka @fashionablykay is an American blogger currently studying in Fashion Merchandising at Kent State University. With over 23.5K followers on instagram and an array of colours on her feed we knew right away that she was a Filer! Main shopping destinations: Nordstrom

@lurchhoundloves

Charlotte Lewis aka @lurchhoundloves is a twenty-eight year old from Cheshire, UK working in the SEO arena as a content and account manager in Manchester but dreams of being a content writer for publications. Her main source of promotion and blogging is through instagram and her popularity stems from Instagram as she has over 5,400 followers. Main shopping destinations: ASOS and Zara

There has now been a transition from the celebrity culture to the ordinary bloggers on instagram who have now become ‘insta famous’ by what they post online. These four instagrammers are who I will be including in my project.


ANNALEA KU BA(HONS) FASHION MEDIA

@lapetiteanglaise

Ella Catliff aka @lapetiteanglaise is a London based fashion, lifestyle and beauty blogger who also part time models for STORM. Ella is probably one of our most successful instagrammers with 31.1K followers and has an array of companies and brands wanting to feature her in various publications such as New York magazine, international Grazia and Elle. Alongside this she is also a univeristy graduate with a BA Fashion history and theory from Central Saint Martins. Main shopping destinations: Reiss

@ t h e s t y l e b u n ga l o w

Stephanie aka @thestylebungalow is a blogger from South Florida who believes that the choices we make in our day to day outfits can send a powerful message and that it’s important to make sure that you’re reflecting who you are through your personal style. Main shopping destinations: ASOS


ANNALEA KU BA(HONS) FASHION MEDIA

4: DESIGN

Font is simple and sleek to go with our web design

The code to change font and put them in place

Homepage- with menu tabs, when clicked they change colour, the homepage ‘click, shop spend’ also flashes


ANNALEA KU BA(HONS) FASHION MEDIA

These pages are all about the instagrammers- click on an instagrammer the cursor moves along with you and then takes you to their page

This is the upload of content coding which was used, whenever i wanted to add anything or change something I alway shad to remove the code.


ANNALEA KU BA(HONS) FASHION MEDIA

These pages take you to the retailer of the garments- bringing in the e-commerce sector from a social network site.

This is the navigation code which is used at times when you need to link pages or sites up together


ANNALEA KU BA(HONS) FASHION MEDIA

I’ve used a different graphic in the ‘trends’ the circled give the website more dimension


ANNALEA KU BA(HONS) FASHION MEDIA

Bringing in the ‘social’ again, the #filefeed is one of the USP’s of our site. Was extremely hard to link everything up however I managed to get it working and coded correctly

Testing the contact sheet out


ANNALEA KU BA(HONS) FASHION MEDIA

LOGO DEVELOPMENT Main website, app and facebook Colour: Black Font: Scriptina Size: 72pt

Instagram and Twitter Colour: Black Font: Scriptina Size: 72pt

Brand Bible Colour: Black Font: Scriptina Size: 72pt

I tried out many variations but in the end I preferred the lighter style of the logo in comparison to the dark harsh colours.


ANNALEA KU BA(HONS) FASHION MEDIA

THE WEB APP DESIGN

Consistent design throught the app

Had to use a different software, adobe dreamweaver to make the app mobile and ipad optimised.


ANNALEA KU BA(HONS) FASHION MEDIA

WEB APP SURVEY

19 respondents answered my survey via survemonkey promoted via facebook and twitter to determine my final target market and decisions for the web app. The consumer is the important factor of this- listening to the consumer is what I have done and have taken on board the results achieved.


ANNALEA KU BA(HONS) FASHION MEDIA

100% of the respondents said they all shop online


ANNALEA KU BA(HONS) FASHION MEDIA

What do you do when you first wake up?!


ANNALEA KU BA(HONS) FASHION MEDIA

FUTURE PLAN FOR FILEOFSTYLE Although FileofStyle is a fully responsive website in conjuction with a web app. We would love to introduce a native app purely based on a seperate subject matter. Bringing in social and technology again, we believe that an application based on an addictive quality like swiping will give us a lot more exposure due to the popularity of swiping activated applications. We have designed the app already and are waiting for an uber talented designer to come and design out fully native app! FileofStyle is a fashion and lifestyle website founded by Anna Ku. Her enthusiasm for digital fashion, media and styling has inspired her to create a unique and dynamic website to fulfil the fashionistas needs! FileofStyle have derived an app that features popular fashion instagrammers and their stylish outfits. However, the question isWhere did they get that outfit from? FileofStyle scour the web to see where instagrammers got the particular outfit from. Swipe right to bin swipe right to file! Don’t worry, thank us later by using the hashtag #ivebeenfiled along with your instagram selfie HAPPY FILING!


ANNALEA KU BA(HONS) FASHION MEDIA

Hello Filers! FileofStyle is a fashion and lifestyle website founded by Anna Ku. Her enthusiasm for digital fashion, media and styling has inspired her to create a unique and dynamic website to fulfil the fashionistas needs!

Swipe left to file Swipe right to trash

FileofStyle have derived an app that features popular fashion instagrammers and their stylish outfits. However, the question isWhere did they get that outfit from? FileofStyle scour the web to see where instagrammers got the particular outfit from swipe right to bin swipe right to file! Don’t worry, thank us later by using the hashtag #ivebeenfiled along with your instagram selfie HAPPY FILING!

@thestylebungalow


ANNALEA KU BA(HONS) FASHION MEDIA

Your file is ready!

SHOP NOW

SHARE YOUR FILE PURCHASE!

TRASH

#ivebeenfiled FileofStyle

SHOP NOW

@fileofstyle_

TRASH

@fileofstyle_


ANNALEA KU BA(HONS) FASHION MEDIA

COSTINGS The cheapest price to develop an app!!! App developers cost thousands as it’s such a timely process to develop a native app


ANNALEA KU BA(HONS) FASHION MEDIA

APP DEVELOPMENT TIMELINE We already have the wireframe, research and proposal all we need is the money and someone who can implement the swiping device.

Hoping to officially finish my app end of April, Right now, I am in the design and development frame. The whole production of an app takes about 2-3 months so i’m about halfway there!


ANNALEA KU BA(HONS) FASHION MEDIA

FREE APP DEVELOPMENTS

Free advertising by using tinder as a source to connect with app developers in the future!

Free app sites have helped me get an idea of what we could produce for free or at a cheaper cost than ÂŁ2,000!


ANNALEA KU BA(HONS) FASHION MEDIA

FILEOFSTYLE BRAND BIBLE

Our branding file #ivebeenfiled WE’RE ON ISSU.COM

WEB APP CODE

www.fileofstyle.com

Read online at: http://issuu.com/avku/docs/fileofstyle_brand_bible


ANNALEA KU BA(HONS) FASHION MEDIA


ANNALEA KU BA(HONS) FASHION MEDIA


ANNALEA KU BA(HONS) FASHION MEDIA


ANNALEA KU BA(HONS) FASHION MEDIA


ANNALEA KU BA(HONS) FASHION MEDIA


ANNALEA KU BA(HONS) FASHION MEDIA


ANNALEA KU BA(HONS) FASHION MEDIA

IMAGERY LIST 1)

http://www.smartinsights.com/mobile-marketing/mobile-marketing-analytics/mobile-marketing-statistics/ (Date accessed 2/2/15)

2)

http://www.smartinsights.com/wp-content/uploads/2013/02/UK-Mobile-Device-Preferences-Statistics.png (Date accessed 2/2/15)

3)

http://www.how-to-build-websites.com (Date accessed 2/2/15)

4)

https://adwords.google.com/KeywordPlanner (Date accessed 10/2/15)

5)

https://www.blogger.com/home?bpli=1&pli=1 (Date accessed 10/2/15)

6)

http://www.marketingdonut.co.uk/marketing/online-marketing/social-media-and-online-networking/action-list-how-to-use-facebook-to-promote-your-business (Date accessed 15/2/15)

7)

http://www.floatdesign.net/case-studies/frank-and-doll/ (Date accessed 15/2/15)

8)

http://www.floatdesign.net/case-studies/frank-and-doll/ (Date accessed 15/2/15)

9)

http://www.floatdesign.net/case-studies/luvahuva/ (Date accessed 15/2/15)

10)

http://www.floatdesign.net/case-studies/luvahuva/ (Date accessed 15/2/15)

11)

http://www.smashingmagazine.com/2013/05/23/building-the-new-financial-times-web-app-a-case-study/ (Date accessed 24/2/15)

12)

http://www.smashingmagazine.com/2013/05/23/building-the-new-financial-times-web-app-a-case-study/ (Date accessed 24/2/15)

13)

http://www.f-i.com/broadway/iPad/ (Date accessed 2/3/15)

14)

http://www.f-i.com/broadway/iPad/ (Date accessed 2/3/15)

15)

http://www.f-i.com/broadway/iPad/ (Date accessed 2/3/15)

16)

http://www.f-i.com/broadway/iPad/(Date accessed 2/3/15)

17)

http://www.f-i.com/broadway/iPad/ (Date accessed 2/3/15)

18)

http://www.f-i.com/googlejapan/messagesforjapan/ (Date accessed 2/3/15)

19)

http://www.f-i.com/googlejapan/messagesforjapan/ (Date accessed 2/3/15)

20)

http://www.f-i.com/googlejapan/messagesforjapan/ (Date accessed 2/3/15)


ANNALEA KU BA(HONS) FASHION MEDIA

21) http://www.f-i.com/googlejapan/messagesforjapan/ (Date accessed 2/3/15) 22) http://www.f-i.com/googlejapan/messagesforjapan/ (Date accessed 2/3/15) 23)

http://www.smartinsights.com/digital-marketing-platforms/c-pinterest-case-studies-drive-engagement/ (Date accessed 15/3/15)

24)

http://www.smashingmagazine.com/2011/06/09/a-comprehensive-website-planning-guide/ (Date accessed 17/3/15)

25)

http://www.missguided.co.uk (Date accessed 22/3/15)

26)

http://www.missguided.co.uk (Date accessed 22/3/15)

27)

http://www.inboundcommerce.com/blog/5-must-know-instagram-ecommerce-marketing-strategi (Date accessed 2/4/15)

28) http://www.inboundcommerce.com/blog/5-must-know-instagram-ecommerce-marketing-strategi (Date accessed 2/4/15) 29)

http://www.shopify.com/blog/12731545-which-social-media-platforms-drive-the-most-sales-infographic (Date accessed 2/4/15)

30)

http://www.shopify.com/blog/12731545-which-social-media-platforms-drive-the-most-sales-infographic (Date accessed 2/4/15)

31)

http://www.postano.com/blog/insta-famous-how-style-bloggers-use-social-strategy-for-profit (Date accessed 6/4/15)

32)

http://www.postano.com/blog/insta-famous-how-style-bloggers-use-social-strategy-for-profit (Date accessed 6/4/15)

33) http://www.huffingtonpost.com/2012/06/21/americans-are-addicted-to-smartphones_n_1615293.html (Date accessed 1/3/15) 34) http://www.slideshare.net/DeloitteAustralia/deloitte-mobile-consumer-survey-2014-report (Date accessed 1/3/15) 35)

https://zenportfolios.ca/capu-bmkt-317-01-spring-2014/ (Date accessed 2/3/15)

36) https://projects.pbs.org/confluence/display/PX/Developing+a+Concept+and+Plan (Date accessed 2/3/15)


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.