61 Merrion Square South, 
Dublin 2, D02 EW25, Ireland

Main Nav

“The Mobile Browser Is Dead, Long Live The App” say <a class="markup--anchor markup--p-anchor" href="http://www.forbes.com/sites/ewanspence/2014/04/02/the-mobile-browser-is-dead-long-live-the-app/" target="_blank" rel="noopener" data-href="http://www.forbes.com/sites/ewanspence/2014/04/02/the-mobile-browser-is-dead-long-live-the-app/">Forbes magazine</a>. Sounds extreme? That’s because it is. They quote a report which says that in the first quarter of last year US users spend an average if 2 hours and 42 minutes of their day on their mobile devices, but only 22 minutes of this time is spent in a browser, the remainder being focused on apps. “If you follow the principle that you need to be where users are, then you need to be building and distributing apps” they say, but that’s a drastic statement. Examining the information in the graph below, you’ll notice that while 86% of user behaviour is app-based, the vast majority of that is consumed by gaming, Facebook, and other social channels. Users aren’t accessing this content solely because it’s available as native mobile apps, they’re accessing social and entertainment channels for leisure.<a href="https://headless2dev.wpengine.com/wp-content/uploads/2015/01/mobile_graph.jpg"><img decoding="async" loading="lazy" class=" size-full wp-image-944 aligncenter" src="https://headless2dev.wpengine.com/wp-content/uploads/2015/01/mobile_graph.jpg" alt="Mobile Apps vs Mobile Sites" width="800" height="727" /></a>
Contrary to what Forbes suggest, building a native mobile app isn’t going to guarantee you any extra users than your existing web presence does, but if your app is useful to your market and delivers content and features that make the most out of the platform then it certainly can do. The main message here is not to make an app for the sake of making an app. As with any sort of digital platform, strategy is key. There are many cases where a mobile or responsive site will make more sense than an app. The most obvious being budgetary restrictions. Designing and creating an app is a heavily labour intensive process, and your app must have separate versions for iOS, Android and Windows devices, amongst others. It’s an expensive route to go down, and alternatives should be considered if time and cost are issues, and unfortunately, they always are!
If your website is designed and built <a class="markup--anchor markup--p-anchor" href="https://headless2dev.wpengine.com/blog/web-design-process/" target="_blank" rel="noopener">properly</a>, (i.e. designed <a class="markup--anchor markup--p-anchor" href="https://headless2dev.wpengine.com/blog/responsive-web-development/" target="_blank" rel="noopener">responsively</a> with a mobile-first strategy) then your website will already look and function well on mobile devices. You can prompt your users to add your website to their home screen. Did you know that you can create app icons for your website so that when it’s added to a home screen you can specify the icon that appears? Once the icons have been designed (in various formats for mobile and tablet), it takes just a few lines of code to add the functionality to your site. With a great mobile site, your web app can look as slick as any native iOS or Android app, and the same site will work and appear the same across all platforms at a fraction of the cost.
<img decoding="async" loading="lazy" class=" size-full wp-image-946 aligncenter" src="https://headless2dev.wpengine.com/wp-content/uploads/2015/01/ios8.jpg" alt="ios8 App" width="350" height="700" />
The case for native apps is strong however, apps perform faster on devices, and can make use of the devices features, i.e. location services/ camera, etc. Think of Facebook’s check in feature for example or Instagram’s camera integration. Apples new Health features are already being incorporated into <a class="markup--anchor markup--p-anchor" href="http://www.macstories.net/reviews/myfitnesspal-adds-healthkit-support-bringing-its-data-to-ios-8s-health-app/" target="_blank" rel="noopener" data-href="http://www.macstories.net/reviews/myfitnesspal-adds-healthkit-support-bringing-its-data-to-ios-8s-health-app/">fitness apps</a> to increase their data sources and offer more and better features to users.
<img decoding="async" loading="lazy" class="alignnone wp-image-947 size-large" src="https://headless2dev.wpengine.com/wp-content/uploads/2015/01/dff_slide_2-1024x524.jpg" alt="Responsive Site Design" width="1024" height="524" />
<h4 class="graf--h4">Mobile/Reponsive Site — Pro’s and Con’s</h4>
Pros
<ul class="postList">
<li class="graf--li">Cost Effective compared to native apps</li>
<li class="graf--li">Design and structure can be updated much quicker than an app.</li>
<li class="graf--li">The coding used will work across all devices, i.e. iOS and Android, so no need for separate deliverables.</li>
<li class="graf--li">Promoting your site as a mobile site will count towards your overall SEO ranking.</li>
<li class="graf--li">Flexibility &#8211; your developer can make changes to your site&#8217;s design or functionality much more easily than in a native app.</li>
<li class="graf--li">Marketing costs are reduced as there is no need to drive users towards a separate app. Users won’t have to go to the trouble of downloading an app, they can connect to the website at any time.</li>
</ul>
Cons
<ul class="postList">
<li class="graf--li">Your user must visit the site through the browser or you must encourage them to add it to the home screen so that they are encouraged to revisit.</li>
<li class="graf--li">Your web app has no visibility in any app store, which potentially could be an issue if competitors do have that visibility.</li>
<li class="graf--li">Mobile/Responsive websites have limited access to the devices built in features.</li>
<li class="graf--li">Your user must be connected to the internet in order to access your mobile site.</li>
</ul>
&nbsp;
<img decoding="async" loading="lazy" class="alignnone wp-image-948 size-large" src="https://headless2dev.wpengine.com/wp-content/uploads/2015/01/fishie11-1024x524.jpg" alt="Mobile App" width="1024" height="524" />
&nbsp;
<h4 class="graf--h4">Native Mobile Apps — Pro’s and Con’s</h4>
Pros
<ul class="postList">
<li class="graf--li">They perform faster than a web app and can work without an internet connection.</li>
<li class="graf--li">Visibility in app stores.</li>
<li class="graf--li">Built-in mobile features give you masses of options in incorporating features into your app, and you can make full use of touchscreen/camera/location/device orientation etc.</li>
<li class="graf--li">Because all native iOS apps need to be authorised and approved, the user has a sense of safety and security when using the app or, crucially for e-commerce, providing payment information.</li>
<li class="graf--li">Once your user has chosen to install your app, it always appears as an icon on their device, encouraging repeat use.</li>
</ul>
Cons
<ul class="postList">
<li class="graf--li">Multiple version of the app must be built for multiple mobile platforms and devices.</li>
<li class="graf--li">There is much less flexibility with a native iOS app, any structural or functional features that need to be re-coded must be re-submitted to the app store for approval, a process that can take weeks, which isn’t ideal.</li>
<li class="graf--li">Cost — The costs for creating a native app is generally much higher than a mobile site</li>
<li class="graf--li">A new strategy is required for marketing and SEO, which must be considered when budgeting for an app.</li>
<li class="graf--li">Users may not always update to the latest version of your app, meaning that any fixes or updates you make may not always be delivered to the user unless they choose to update.</li>
</ul>
Both routes carry a strong case, and the best solution for your business will be based on your content strategy, how you want to deliver content to your users, and how you want them to interact with it. If mobile apps are something you’re considering for your brand right now, then get in touch, we’d love to talk more about it!

Mobile Apps or Responsive Websites: how to choose?

We are still basking in the glow of the fact that at only 6 months in, we can call ourselves an award-winning Digital Agency. To celebrate this, we have decided to share some insight into how we work and the process we use for web design and development.
Our web design process is everything to us, it provides our team of designers and developers and our clients with a transparent and highly collaborative path to launch. Processes establish lines of responsibility, create timings and deadlines, explain costs to the client and because it&#8217;s based on a system where one stage cannot be started until the previous stage is complete, it provides very clear approval milestones.
One size does not fit all&#8230; every project is different and our process is always tailored to suit. However, this is the base process we use to start a project.
<h3>Planning and Requirement Planning</h3>
Planning is the most important stage of any project. All the stakeholders in a web design project need a comprehensive understanding of the work that needs to be done, when it will be done and who is going to do it.
If you have a comprehensive plan when you start something it gives the whole process clarity, a shared vision, increases efficiency, reduces the chances of error and marks out areas of responsibility.
We kick off any web design project by meeting with our client, establishing the team and developing the requirements. We look at the goals and objectives of the new website and any problems with the client&#8217;s current online presence. We look at the competition and where possible, we carry out research by talking to the people who will be using the website.
Output: A detailed website spec and information architecture sitemap
<h3>Website Wireframes</h3>
A website wireframe is like a blueprint. It is the <a href="https://headless2dev.wpengine.com/expertise/user-experience/ux-design-dublin/">user experience (UX) design</a> without the distraction of colour, typography, photography and style. It allows us to focus on the user&#8217;s journey through the website, the functionality, content structure and interactivity.
Only after we have agreed the website wireframes with the client can the design process begin.
Output: Wireframe sketches for each main web page template in various devise sizes
<h3>Design Brief</h3>
As part of the design process we collaborate closely with our clients to explore design direction. This is usually done through a design workshop where everyone brings ideas, examples and thoughts to the table and we discuss what the best direction is for the look and feel of the website.
We explore the brand, it&#8217;s personality and how it should to be presented online. We look at the competition&#8217;s web presence as well as unrelated websites. Notes are taken and opinions are collated.
Output: A written design brief with visuals to explain design direction, layout, typography, colours and photography
<h3>Artwork</h3>
We don’t believe in surprises at The Friday Agency. With close collaboration, the output of the design stage shouldn’t be a surprise as the client has had input and we have communicated our direction clearly. The expectation of quality is set by our previous work and what we referenced throughout the planning stages. The usual outcome would be that because of collaboration and detailed planning the first design iteration would be very close to the final design and layout.
Design is produced by referencing the wireframes and design brief. We usually start with the homepage on both mobile and desktop sizes and work through the website page by page.
Output: Artwork for each main web page template in various device sizes
<h3>HTML/CSS Markup</h3>
The first stage of development is HTML and CSS markup: this is where we take the website&#8217;s artwork and carry out what we call &#8216;slice &amp; dice&#8217;. The website pages are marked up in clean and efficient HTML and CSS that is responsive across current and future devices.
Images are optimised to load as quickly as possible. We also future proof quality by optimising images for HiDPI or Retina displays. Vector SVG’s are used where possible to maximise load time and image quality.
Output: Browser tested responsive HTML/CSS files for each page template
<h3>Development</h3>
<a href="https://headless2dev.wpengine.com/expertise/technology/web-development-dublin/">Web development</a> is when we build the website with the assets already produced. Design and markup is integrated into the backend technology. Databases are set up, functionality is created through code, web servers are configured, security is locked down and content is migrated.
This is the stage of the project with the least amount of collaboration between agency and client: all the planning has led up to this point &#8211; we are building exactly what the client has requested so we combine this with our own input and expertise.
Output: Beta website
<h3>Testing</h3>
When we have a beta website we carry out our first stage testing. This covers user testing, layout, functionality, server, script efficiency and load time as well as multiple browser and device tests. The second stage is to share a beta link with the client so they can carry out their own review. Feedback is collated and changes are made if required.
Output: Final Alpha website
<h3>Website Launch</h3>
When everyone is happy we migrate the website to the live server and launch. In some cases we may do a soft launch, this is when the website is put live but is not announced or advertised. This allows us to get feedback from the public without it being seen by the masses.
Only after a website is launched can a <a href="https://headless2dev.wpengine.com/expertise/digital-marketing/search-engine-optimisation/">Search Engine Optimisation (SEO)</a> campaign be carried out. There is an entire blog post that could be written about how we manage this stage of a website project and we will cover this at a later date in detail.
Output: Live website

Blog

Mobile Apps or Responsive Websites: how to choose?

The Web Design Process