Front End Effectiveness – Federico Weber

•

0 j'aime•441 vues

The document discusses how to create an effective front-end interface between users and back-end systems. It recommends reducing elements to define the core experience, making the interface fast by optimizing page load times and animations, and making it pleasing through good spatial layout, minimal waiting times, and microinteractions. The most effective interface may have no graphical user interface at all and rely on automation and conversational interfaces.

Technologie

FRONT-END
is an interface between the user and the back end

define the core
experience
- what problem it solve ?
- what is the smallest part that deﬁne the
experience ?

treading the Path of
Least Resistance
Without realizing it, we instantly and automatically
categorize every situation we see based on our previous
experience

context awareness
- where is the user
- how good is the connection
- how much time the user have

time is money
Amazon's calculated that a page load slowdown of just
one second could cost it $1.6 billion in sales each year

waiting is
frustrating
4 in 10 Americans give up accessing a mobile shopping
site that won't load in just three seconds

Milestone timings
how long it takes to load the page

SpeedIndex
it’s a measure of how the page progressed
from start to ﬁnish.
introduced by webpagetest.org

Rule based metrics
the result is computed based on a checklist
PageSpeed score; YSlow score

Performance
Budget
performance budget builder by Brad Frost
http://codepen.io/bradfrost/pen/EPQVBp/

SERVICE WORKERS
a service worker is a script that is run by your browser in
the background, separate from a web page

enforce spatial
relations
keep your user oriented in your UI

avoid Interstitial
Anxiety
interstitial anxiety refers to the momentary state of tension
a user experiences between an action (clicking a button)
and a response (moving to the next page)

animation matter
it help communicating feedback to the users,
and deﬁning the character and tone of your interface

microinteractions
are contained product moments that revolve around a
single use case—they have one main task.

Contenu connexe

Tendances

14 timeless rules for creating intuitive web apps

MAAN Softwares INC.

Poynter Mobile Prezo

David Cohn

14 timeless rules for creating intuitive web apps

Dev Technosys

Business Values of PWAs

UXDXConf

The Progressive Web and its New Challenges - Confoo Montréal 2017

Christian Heilmann

These are the accompanying slides from a workshop / lecture I delivered in both November 2013 to a group of students from the University of Central Lancashire, and in January 2014 to a group of students from Manchester Metropolitan University, on the topic of responsive design. This is version 2 of this slideshow, which includes added information and slides from my visit to MMU. The task list from the workshop can be found here: http://www.richardsonweb.co.uk/responsive_tasks.pdf

An Introduction to Responsive Design

Liam Richardson

These are the accompanying slides from a workshop / lecture delivered in both November 2013 to a group of students from the University of Central Lancashire, and in January 2014 to a group of students from Manchester Metropolitan University, on the topic of responsive design. This is version 2 of this slideshow, which includes added information and slides from Liam's visit to MMU. The task list from the workshop can be found here: http://www.richardsonweb.co.uk/responsive_tasks.pdf

An Introduction to Responsive Design

Nexer Digital

Why Performance Matters

Ben Daniel

In 2006 a friend turned me on to a new test harness called Selenium. The framework had little documentation and ran inside a weird, janky frameset. But Selenium had two killer features: you didn’t need Windows administrator privileges to install it and it was the only free GUI-driven regression testing framework for Web sites. Five years later I find myself in the position of having used Selenium in a business context for almost half my career and nearly the entire lifetime of the tool. Selenium’s changed a lot, so have the Web sites it was designed to test, and so has the Web itself. I look forward to talking about how I have helped businesses leverage Selenium to manage change and increase their ability to adapt in the ever-evolving world of eCommerce.

Selenium in the enterprise what went right and what went wrong so far - sel...

Noah Sussman

E-Commerce

Andrew Yokoyama

Tendances (10)

14 timeless rules for creating intuitive web apps

Poynter Mobile Prezo

14 timeless rules for creating intuitive web apps

Business Values of PWAs

The Progressive Web and its New Challenges - Confoo Montréal 2017

An Introduction to Responsive Design

Why Performance Matters

Selenium in the enterprise what went right and what went wrong so far - sel...

E-Commerce

En vedette

Enquiries on the responsive web

Federico Weber

Atom Text Editor: Resistance is Futile

Alessandro Muraro

Introduction to CSS Grid Layout

Rachel Andrew

Learn BEM: CSS Naming Convention

In a Rocket

SEO: Getting Personal

Kirsty Hulse

How to Build a Dynamic Social Media Plan

Post Planner

En vedette (6)

Enquiries on the responsive web

Atom Text Editor: Resistance is Futile

Introduction to CSS Grid Layout

Learn BEM: CSS Naming Convention

SEO: Getting Personal

How to Build a Dynamic Social Media Plan

Similaire à Front End Effectiveness – Federico Weber

Slides from my session at StartupBootcamp Smart City & Living program... You never get a second chance to make a first impression. The same goes for online, where the decision to bounce is often made in the first 2 seconds, and Google will lower your ranking if your site is too slow... This talks is about why startups should care about speed when building product, how to improve design with speed and how to measure & optimize speed and beat the (corporate) competition...

MeasureWorks - Design for Fast Experiences (Startup session).key

MeasureWorks

Compuware ASEAN APM User Conference 2013 - University of Customer Experience

Compuware ASEAN

2021 Chrome Dev Summit: Web Performance 101

Tammy Everts

MeasureWorks - Design for Fast Experiences

MeasureWorks

17 Web Performance Metrics You Should Care About

Evgeny Tsarkov

Smart bear & Jones Apparel - IRCE 2013 - Finding the small things that can ma...

KenGodskind

Magento Optimization Whitepaper

Vladyslav Solodovnyk

Here at Growth Engineering, we’ve seen first-hand the growing trend of companies seeking mobile learning solutions. Time and again, the same question comes up: “do I need a designated mobile learning platform or is it enough to make sure the LMS is responsive?” In this slide deck, we'll take you through the pros and cons of each approach, so you can weigh up the good, the bad and the ugly. For more information, please visit www.growthengineering.co.uk

Mobile First Solution vs Responsive Site: What's Best for Your Learners?

Growth Engineering

Web performance optimisation has been gaining ground and is slowly getting more of its deserved recognition. Nevertheless, much of our time on the web is still used up by waiting. To decrease our wait time and improve the web’s overall performance, this integral part of user experience needs further promotion. Waiting and the perception of time itself, is reason enough to explore some of the psychological effects time has on our users, too. Passing time also plays a big role in the evolution of technologies. Through the history of HTTP we have reached the latest version as HTTP/2, which will turn some of our existing web performance best practices on their head and into the new anti-patterns of today.

Web Performance in the Age of HTTP2 - Topconf Tallinn 2016 - Holger Bartel

Holger Bartel

Gomez

barkstriker

Are you maximizing the return on your mobile investment? With mobile services your customers expect quick anytime transactions that work flawlessly. Failure to identify and resolve a slow – or worse – malfunctioning mobile service will result in lost customers and irreparable brand damage. Join featured speakers, Julie Ask, VP and Principal Analyst from independent research firm Forrester Research, Inc., and Compuware CTO APM Solutions Imad Mouline to learn: - How to quantify the return on investment for your mobile services - What growing mobile Web adoption and rising customer expectations mean for mobile service owners - Common challenges that prohibit companies from capitalizing on the mobile opportunity - Best practices to deliver quality mobile Web and application experiences to all end-users

How to maximize mobile website & app ROI

Compuware APM

4 Effective Tips to Optimize Your Mobile E-commerce Conversion Rates

Helios Solutions

MeasureWorks - Akamai - Designing for Time and Conversion

MeasureWorks

Evolution & AMPlification of Mobile Search Marketing [Driving Traffic & Conve...

LeadSquared

Once upon a time early modems were slow. The broadband came along and web page byte count and code skyrocketed. Now? Now we have slowness even at broadband speeds due to page bloat. And if you're on mobile, you've got slowness and the added annoyance of possibly higher battery drain. It's time to start thinking about web site performance as a feature in and of itself. Because if you're too slow, none of your other features will matter. Your visitor will be gone before the page renders. Presentation excerpt from Udemy course "Digital Product Management" http://udemy.com/digital-product-management

Web Page Speed - A Most Important Feature

Scott Germaise

Leveraging Website Speed to Increase Sales

Vendasta Technologies

How fast does your website load? Website loading time is one of the most crucial factors in delivering an excellent user experience, boosting search rankings, and driving conversions. But what is considered a good page load time in 2023? This in-depth blog post dives into the latest website loading time statistics and benchmarks you need to know to optimize your site's performance. Discover fascinating insights such as: The average website load time in 2023 is 2.5 seconds on desktop and 8.6 seconds on mobile, but top performing sites aim for under 2 seconds As page load time goes from 1 second to 3 seconds, the probability of bounce increases by 32% A 100-millisecond delay in website load time can hurt conversion rates by 7% The top 10 ecommerce websites have an average page load time of just 1.96 seconds 47% of online shoppers expect web pages to load in 2 seconds or less Learn what factors impact website loading times, how speed affects critical metrics like bounce rate, conversions and revenue, and best practices to achieve sub-second load times. If you want to boost your search engine rankings, user engagement, and online sales, optimizing your page load time is essential. Discover the data you need to benchmark your site against competitors and exceed customer expectations in this statistics-packed post.

Website Loading Time Statistics Crucial Data for Optimal Performance.pdf

Christopher Jan Benitez

MeasureWorks - The Waiting Experience

MeasureWorks

Mobile Second @ NextStep 2014

Gonçalo Veiga

Performance testing of a web app focuses entirely on the performance characteristics such as loading speed, network connection, security, user-friendliness, and so forth. Today, web applications have become the central focus of many enterprises. According to the latest reports, 53% of users abandon a page that takes more than 3 seconds to load. Similarly, network downtimes also lead to huge losses in revenue. One way to improve this is to conduct thorough web application performance testing.

The Relevance of Web Application Performance Testing

Mindfire LLC

Similaire à Front End Effectiveness – Federico Weber (20)

MeasureWorks - Design for Fast Experiences (Startup session).key

Compuware ASEAN APM User Conference 2013 - University of Customer Experience

2021 Chrome Dev Summit: Web Performance 101

MeasureWorks - Design for Fast Experiences

17 Web Performance Metrics You Should Care About

Smart bear & Jones Apparel - IRCE 2013 - Finding the small things that can ma...

Magento Optimization Whitepaper

Mobile First Solution vs Responsive Site: What's Best for Your Learners?

Web Performance in the Age of HTTP2 - Topconf Tallinn 2016 - Holger Bartel

Gomez

How to maximize mobile website & app ROI

4 Effective Tips to Optimize Your Mobile E-commerce Conversion Rates

MeasureWorks - Akamai - Designing for Time and Conversion

Evolution & AMPlification of Mobile Search Marketing [Driving Traffic & Conve...

Web Page Speed - A Most Important Feature

Leveraging Website Speed to Increase Sales

Website Loading Time Statistics Crucial Data for Optimal Performance.pdf

MeasureWorks - The Waiting Experience

Mobile Second @ NextStep 2014

The Relevance of Web Application Performance Testing

Dernier

[2024]Digital Global Overview Report 2024 Meltwater.pdf

hans926745

2024: Domino Containers - The Next Step. News from the Domino Container commu...

Martijn de Jong

Real Time Object Detection Using Open CV

Khem

The presentation explores the development and application of artificial intelligence (AI) from its inception to its current status in the modern world. The term "artificial intelligence" was first coined by John McCarthy in 1956 to describe efforts to develop computer programs capable of performing tasks that typically require human intelligence. This concept was first introduced at a conference held at Dartmouth College, where programs demonstrated capabilities such as playing chess, proving theorems, and interpreting texts. In the early stages, Alan Turing contributed to the field by defining intelligence as the ability of a being to respond to certain questions intelligently, proposing what is now known as the Turing Test to evaluate the presence of intelligent behavior in machines. As the decades progressed, AI evolved significantly. The 1980s focused on machine learning, teaching computers to learn from data, leading to the development of models that could improve their performance based on their experiences. The 1990s and 2000s saw further advances in algorithms and computational power, which allowed for more sophisticated data analysis techniques, including data mining. By the 2010s, the proliferation of big data and the refinement of deep learning techniques enabled AI to become mainstream. Notable milestones included the success of Google's AlphaGo and advancements in autonomous vehicles by companies like Tesla and Waymo. A major theme of the presentation is the application of generative AI, which has been used for tasks such as natural language text generation, translation, and question answering. Generative AI uses large datasets to train models that can then produce new, coherent pieces of text or other media. The presentation also discusses the ethical implications and the need for regulation in AI, highlighting issues such as privacy, bias, and the potential for misuse. These concerns have prompted calls for comprehensive regulations to ensure the safe and equitable use of AI technologies. Artificial intelligence has also played a significant role in healthcare, particularly highlighted during the COVID-19 pandemic, where it was used in drug discovery, vaccine development, and analyzing the spread of the virus. The capabilities of AI in healthcare are vast, ranging from medical diagnostics to personalized medicine, demonstrating the technology's potential to revolutionize fields beyond just technical or consumer applications. In conclusion, AI continues to be a rapidly evolving field with significant implications for various aspects of society. The development from theoretical concepts to real-world applications illustrates both the potential benefits and the challenges that come with integrating advanced technologies into everyday life. The ongoing discussion about AI ethics and regulation underscores the importance of managing these technologies responsibly to maximize their their benefits while minimizing potential harms.

Artificial Intelligence: Facts and Myths

Joaquim Jorge

Advantages of Hiring UIUX Design Service Providers for Your Business

Pixlogix Infotech

AWS Community Day CPH - Three problems of Terraform

Andrey Devyatkin

🐬 The future of MySQL is Postgres 🐘

RTylerCroy

A Domino Admins Adventures (Engage 2024)

Gabriella Davis

Effective data discovery is crucial for maintaining compliance and mitigating risks in today's rapidly evolving privacy landscape. However, traditional manual approaches often struggle to keep pace with the growing volume and complexity of data. Join us for an insightful webinar where industry leaders from TrustArc and Privya will share their expertise on leveraging AI-powered solutions to revolutionize data discovery. You'll learn how to: - Effortlessly maintain a comprehensive, up-to-date data inventory - Harness code scanning insights to gain complete visibility into data flows leveraging the advantages of code scanning over DB scanning - Simplify compliance by leveraging Privya's integration with TrustArc - Implement proven strategies to mitigate third-party risks Our panel of experts will discuss real-world case studies and share practical strategies for overcoming common data discovery challenges. They'll also explore the latest trends and innovations in AI-driven data management, and how these technologies can help organizations stay ahead of the curve in an ever-changing privacy landscape.

TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery

TrustArc

Tech Trends Report 2024 Future Today Institute.pdf

hans926745

Join our latest Connector Corner webinar to discover how UiPath Integration Service revolutionizes API-centric automation in a 'Quote to Cash' process—and how that automation empowers businesses to accelerate revenue generation. A comprehensive demo will explore connecting systems, GenAI, and people, through powerful pre-built connectors designed to speed process cycle times. Speakers: James Dickson, Senior Software Engineer Charlie Greenberg, Host, Product Marketing Manager

Connector Corner: Accelerate revenue generation using UiPath API-centric busi...

DianaGray10

Imagine a world where information flows as swiftly as thought itself, making decision-making as fluid as the data driving it. Every moment is critical, and the right tools can significantly boost your organization’s performance. The power of real-time data automation through FME can turn this vision into reality. Aimed at professionals eager to leverage real-time data for enhanced decision-making and efficiency, this webinar will cover the essentials of real-time data and its significance. We’ll explore: FME’s role in real-time event processing, from data intake and analysis to transformation and reporting An overview of leveraging streams vs. automations FME’s impact across various industries highlighted by real-life case studies Live demonstrations on setting up FME workflows for real-time data Practical advice on getting started, best practices, and tips for effective implementation Join us to enhance your skills in real-time data automation with FME, and take your operational capabilities to the next level.

From Event to Action: Accelerate Your Decision Making with Real-Time Automation

Safe Software

Created by Mozilla Research in 2012 and now part of Linux Foundation Europe, the Servo project is an experimental rendering engine written in Rust. It combines memory safety and concurrency to create an independent, modular, and embeddable rendering engine that adheres to web standards. Stewardship of Servo moved from Mozilla Research to the Linux Foundation in 2020, where its mission remains unchanged. After some slow years, in 2023 there has been renewed activity on the project, with a roadmap now focused on improving the engine’s CSS 2 conformance, exploring Android support, and making Servo a practical embeddable rendering engine. In this presentation, Rakhi Sharma reviews the status of the project, our recent developments in 2023, our collaboration with Tauri to make Servo an easy-to-use embeddable rendering engine, and our plans for the future to make Servo an alternative web rendering engine for the embedded devices industry. (c) Embedded Open Source Summit 2024 April 16-18, 2024 Seattle, Washington (US) https://events.linuxfoundation.org/embedded-open-source-summit/ https://ossna2024.sched.com/event/1aBNF/a-year-of-servo-reboot-where-are-we-now-rakhi-sharma-igalia

A Year of the Servo Reboot: Where Are We Now?

Igalia

GenAI Risks & Security Meetup 01052024.pdf

lior mazor

Three things you will take away from the session: • How to run an effective tenant-to-tenant migration • Best practices for before, during, and after migration • Tips for using migration as a springboard to prepare for Copilot in Microsoft 365 Main ideas: Migration Overview: The presentation covers the current reality of cross-tenant migrations, the triggers, phases, best practices, and benefits of a successful tenant migration Considerations: When considering a migration, it is important to consider the migration scope, performance, customization, flexibility, user-friendly interface, automation, monitoring, support, training, scalability, data integrity, data security, cost, and licensing structure Next Wave: The next wave of change includes the launch of Copilot, which requires businesses to be prepared for upcoming changes related to Copilot and the cloud, and to consolidate data and tighten governance ShareGate: ShareGate can help with pre-migration analysis, configurable migration tool, and automated, end-user driven collaborative governance

Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff

sammart93

This presentations targets students or working professionals. You may know Google for search, YouTube, Android, Chrome, and Gmail, but did you know Google has many developer tools, platforms & APIs? This comprehensive yet still high-level overview outlines the most impactful tools for where to run your code, store & analyze your data. It will also inspire you as to what's possible. This talk is 50 minutes in length.

Powerful Google developer tools for immediate impact! (2023-24 C)

wesley chun

Discord is a free app offering voice, video, and text chat functionalities, primarily catering to the gaming community. It serves as a hub for users to create and join servers tailored to their interests. Discord’s ecosystem comprises servers, each functioning as a distinct online community with its own channels dedicated to specific topics or activities. Users can engage in text-based discussions, voice calls, or video chats within these channels. Understanding Discord Servers Discord servers are virtual spaces where users congregate to interact, share content, and build communities. Servers may revolve around gaming, hobbies, interests, or fandoms, providing a platform for like-minded individuals to connect. Communication Features Discord offers a range of communication tools, including text channels for messaging, voice channels for real-time audio conversations, and video channels for face-to-face interactions. These features facilitate seamless communication and collaboration. What Does NSFW Mean? The acronym NSFW stands for “Not Safe For Work,” indicating content that may be inappropriate for professional or public settings. NSFW Content NSFW content encompasses material that is sexually explicit, violent, or otherwise graphic in nature. It often includes nudity, profanity, or depictions of sensitive topics.

Understanding Discord NSFW Servers A Guide for Responsible Users.pdf

UK Journal

Scaling API-first – The story of a global engineering organization Ian Reasor, Senior Computer Scientist - Adobe Radu Cotescu, Senior Computer Scientist - Adobe Apidays New York 2024: The API Economy in the AI Era (April 30 & May 1, 2024) ------ Check out our conferences at https://www.apidays.global/ Do you want to sponsor or talk at one of our conferences? https://apidays.typeform.com/to/ILJeAaV8 Learn more on APIscene, the global media made by the community for the community: https://www.apiscene.io Explore the API ecosystem with the API Landscape: https://apilandscape.apiscene.io/

Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe

apidays

Abhishek Deb(1), Mr Abdul Kalam(2) M. Des (UX) , School of Design, DIT University , Dehradun. This paper explores the future potential of AI-enabled smartphone processors, aiming to investigate the advancements, capabilities, and implications of integrating artificial intelligence (AI) into smartphone technology. The research study goals consist of evaluating the development of AI in mobile phone processors, analyzing the existing state as well as abilities of AI-enabled cpus determining future patterns as well as chances together with reviewing obstacles as well as factors to consider for more growth.

Exploring the Future Potential of AI-Enabled Smartphone Processors

debabhi2

The value of a flexible API Management solution for Open Banking Steve Melan, Manager for IT Innovation and Architecture - State's and Saving's Bank of Luxembourg Apidays New York 2024: The API Economy in the AI Era (April 30 & May 1, 2024) ------ Check out our conferences at https://www.apidays.global/ Do you want to sponsor or talk at one of our conferences? https://apidays.typeform.com/to/ILJeAaV8 Learn more on APIscene, the global media made by the community for the community: https://www.apiscene.io Explore the API ecosystem with the API Landscape: https://apilandscape.apiscene.io/

Apidays New York 2024 - The value of a flexible API Management solution for O...

apidays

Dernier (20)

[2024]Digital Global Overview Report 2024 Meltwater.pdf

2024: Domino Containers - The Next Step. News from the Domino Container commu...

Real Time Object Detection Using Open CV

Artificial Intelligence: Facts and Myths

Advantages of Hiring UIUX Design Service Providers for Your Business

AWS Community Day CPH - Three problems of Terraform

🐬 The future of MySQL is Postgres 🐘

A Domino Admins Adventures (Engage 2024)

TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery

Tech Trends Report 2024 Future Today Institute.pdf

Connector Corner: Accelerate revenue generation using UiPath API-centric busi...

From Event to Action: Accelerate Your Decision Making with Real-Time Automation

A Year of the Servo Reboot: Where Are We Now?

GenAI Risks & Security Meetup 01052024.pdf

Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff

Powerful Google developer tools for immediate impact! (2023-24 C)

Understanding Discord NSFW Servers A Guide for Responsible Users.pdf

Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe

Exploring the Future Potential of AI-Enabled Smartphone Processors

Apidays New York 2024 - The value of a flexible API Management solution for O...

Front End Effectiveness – Federico Weber

1. @federicoweber FRONT-END EFFECTIVENESS

2. FRONT-END is an interface between the user and the back end

3. EFFICIENCY EFFECTIVENESS VS

4. EFFICIENCY is doing things right

5. EFFECTIVENESS is doing the right thing

6. THREE STEPS TO AN EFFECTIVE INTERFACE

7. REDUCE

8. define the core experience - what problem it solve ? - what is the smallest part that deﬁne the experience ?

9. treading the Path of Least Resistance Without realizing it, we instantly and automatically categorize every situation we see based on our previous experience

10. context awareness - where is the user - how good is the connection - how much time the user have

11. MAKE IT FAST

12. time is money Amazon's calculated that a page load slowdown of just one second could cost it $1.6 billion in sales each year

13. waiting is frustrating 4 in 10 Americans give up accessing a mobile shopping site that won't load in just three seconds

14. MAKE IT RIDICULOUSLY FAST

15. HOW TO MEASURE IT ?

16. Milestone timings how long it takes to load the page

17. SpeedIndex it’s a measure of how the page progressed from start to ﬁnish. introduced by webpagetest.org

18. Rule based metrics the result is computed based on a checklist PageSpeed score; YSlow score

19. Performance Budget performance budget builder by Brad Frost http://codepen.io/bradfrost/pen/EPQVBp/

20. SERVICE WORKERS a service worker is a script that is run by your browser in the background, separate from a web page

21. MAKE IT PLEASING

22. enforce spatial relations keep your user oriented in your UI

23. avoid Interstitial Anxiety interstitial anxiety refers to the momentary state of tension a user experiences between an action (clicking a button) and a response (moving to the next page)

24. animation matter it help communicating feedback to the users, and deﬁning the character and tone of your interface

25. microinteractions are contained product moments that revolve around a single use case—they have one main task.

26. WHAT IS THE FASTEST UI ?

27. NO GUI AT ALL

28. automate as much as possible

29. conversational interfaces