Tech Webinar: User interface design patterns per mobile web apps - Mauro Del Gaudio

•

8 j'aime•2,060 vues

Tech Webinar tenuto da Simone Bordet. Per partecipare ad altri Tech Webinar gratuiti potete iscrivervi qui:http://goo.gl/iW81VD In questo Tech Webinar si parlerà di: Approcci, Best Practices, Design patterns Cosa sono le UI e UX Design Patterns UI per dispositivi iOS, Android e Windows 8 Usabilità per la progettazione dell'esperienza utente (UX) Realizzazione dell'interfaccia utente (UI) di web apps per tablet e smartphone

Technologie

USER INTERFACE DESIGN PATTERNS  
PER MOBILE WEB APPS

Mauro Del Gaudio 4
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Il web sta cambiando

Mauro Del Gaudio 5
E gli utenti?
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio
Sono loro a dettare il cambiamento!
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
6

Mauro Del Gaudio 7
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
http://digitics.in/mobile-marketing-vs-online-media/

Mauro Del Gaudio 8
Quindi sta cambiando anche il modo di progettare?
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 9
Nuovi approcci, nuovi strumenti, nuovi design pattern!
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
SI!

Mauro Del Gaudio 10
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Cosa sono i design pattern?

Mauro Del Gaudio 11
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
“Soluzioni progettuali generali a problemi ricorrenti”

Mauro Del Gaudio 12
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Esempi di menu design pattern

Mauro Del Gaudio 13
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
List Menu

Mauro Del Gaudio 14
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 15
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 16
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 17
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Springboard

Mauro Del Gaudio 18
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 19
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 20
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 21
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Tab Menu

Mauro Del Gaudio 22
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 23
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 24
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Esempi di interazione con elementi nativi

Mauro Del Gaudio 25
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Name:
E-mail:
Message:
Send

Mauro Del Gaudio 26
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Name:
Mario Ros|
E-mail:
Message:
Send
Q W E R T Y U I O P
A S D F G H J K L
Z X C V B N M
123 space return

Mauro Del Gaudio 27
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
E-mail:
Message:
Send
Q W E R T Y U I O P
A S D F G H J K L
Z X C V B N M
123 space return
Lorem ipsum|

Mauro Del Gaudio 28
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
E-mail:
Message:
Send
Q W E R T Y U I O P
A S D F G H J K L
Z X C V B N M
123 space return
Lorem ipsum|
Fixed Block

Mauro Del Gaudio 29
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Attenzione agli ingombri!

Mauro Del Gaudio 30
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Q W E R T Y U I O P
A S D F G H J K L
Z X C V B N M
123 space return
q
a
z
space
x
,
c v b n m
s d f g h j k l
w e r t y u i o p
&123
,?123 .
a s d f g h j k l
z x c v b n m
q w e r t y u i o p
1 2 3 4 5 6 7 8 9 0
Android iOS Windows Phone

Mauro Del Gaudio 31
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Gesture

Mauro Del Gaudio 32
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Proﬁle
Alerts
Bill Pay
Location
Settings
Help
Contact
Support
News

Mauro Del Gaudio 33
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Proﬁle
Alerts
Bill Pay
Location
Settings
Help
Contact
Support
News

Mauro Del Gaudio 34
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS

Mauro Del Gaudio 35
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Complete
EditDelete

Mauro Del Gaudio 36
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Come si sceglie il giusto design pattern?

Mauro Del Gaudio 37
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Alcune domande da porsi

Mauro Del Gaudio 38
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Chi userà questa applicazione?

Mauro Del Gaudio 39
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Su quali dispositivi sarà usata?

Mauro Del Gaudio 40
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
Fixed? Fluid? Adaptive? Responsive?

Mauro Del Gaudio 41
USER INTERFACE DESIGN PATTERNS PER MOBILE WEB APPS
La scelta del giusto design pattern deve servire a migliorare
l’esperienza utente (UX), non ad aggiungere vezzi estetici alla
vostra interfaccia utente (UI).

Contenu connexe

Similaire à Tech Webinar: User interface design patterns per mobile web apps - Mauro Del Gaudio

Chrome for android_devfestx

Dominic Travers

Metro design primer

Andy Chiang

Ashfaq Amin's UX Portfolio

Ashfaq Amin

Portfolio Karen Sátiro

Karen Sátiro

Going 2D: The benefits of flat design for websites

company

An introduction to user experience design

Elena Donets

Mobile App Screen Prototypes Designing Proposal PowerPoint Presentation Slides

SlideTeam

Your app is not modern unless it looks modern. That's why it's so important to stay on top of the latest app design trends, including what's in store for us in 2021. The question is, how can you predict the popular visual styles of tomorrow today? Who would know better than the application designers themselves? We asked the 99designs community of freelance app designers what trends they've noticed lately. These are the top app design trends that you can expect to see more of in the next year and beyond.

Top ui ux design trends for mobile apps 2021

sravanthisravanthi6

Layout

lexinamer

UI vs. UX: What’s the difference?

DariaPersell

Maintainable design

Filip Rakowski

Top 10 Mobile App UI/UX Design Trends in 2022

WebGuru Infosystems Pvt. Ltd.

Ui ux design trends that will dominate in 2021

Kelly Ston

NinjaBit is an innovative software house, based in Milano - Italy, specialised in web and mobile applications design and development. Our developers and designers drive the edge of technology, making it through real life projects for our customers, who can take advantage of the power of web and mobile communication to empower their trademarks, their customers’ relationships and their workflows. We help small and medium businesses to maximise results and incomes leveraging the most modern web and mobile technologies, providing with innovative and flexible solutions. MOBILE DEV Design and development for iOS, Android and Windows platforms Mobile apps Mobile games Mobile sites Mobile commerce Minimum Viable Product WEB DEV Design and development for web platforms Realtime web applications Backend Frontend Webservices CMS e-commerce Responsive UI Minimum Viable Product DESIGN UI/UX design Icon design Graphic design Brand design Character design Visit http://www.ninjabit.com/ for more information.

Ninjabit ppt

Chiara Colangelo

If you haven’t gone responsive yet then you need to. Responsive website design has been the buzz word among web designers for a few years now, but with the rising use of mobile technology by consumers, it is becoming the buzz word with business owners too. Responsive web design dynamically reacts to the size, orientation, platform and device chosen by the user. Each element of the page, from the pictures to the font, reconfigures to the optimum size for the screen. At the moment, most websites are focusing on laptop, tablet and mobile design sizes, with some even calculating in larger desktop computers. Responsive design isn’t an easy subject to grasp and many people ask us all the time: What is responsive web design, what is it good for and do we need it? This whitepaper will cover the benefits of a responsive website and the basics of a responsive web design, without going too technical.

Responsive Web Design Whitepaper

Prototype Interactive

Careers In Web Design

Adrian Mendoza

Top 7 UI Design Trends For 2021 - 2022

Vishal Sinhasan

Kony Visualizer Puts Mobile Apps Features Control in Hands of Those Closest t...

Dana Gardner

Most people could barely sense any difference between 2020 and 2021 but those were exciting years for UI/UX designers. There were a lot of amazing apps and websites launched with a lot of creative softwares for designers. Also, the introduction of Metaverse in 2021 caused excitement in the UI/UX industry. When designers were forced to sit at home, they analyzed and reflected the existing trends to create and update new and better things.Hence, based on the existing design trends of 2020 and 2021, it is quite easy to gauge what 2022 will bring on the table for UI/UX designers.

7 top UI UX Design Trends to follow in 2022.pptx

Red Baton Design Studio

interaction design trends 2015 _ 2016

Halil Eren Çelik

Similaire à Tech Webinar: User interface design patterns per mobile web apps - Mauro Del Gaudio (20)

Chrome for android_devfestx

Metro design primer

Ashfaq Amin's UX Portfolio

Portfolio Karen Sátiro

Going 2D: The benefits of flat design for websites

An introduction to user experience design

Mobile App Screen Prototypes Designing Proposal PowerPoint Presentation Slides

Top ui ux design trends for mobile apps 2021

Layout

UI vs. UX: What’s the difference?

Maintainable design

Top 10 Mobile App UI/UX Design Trends in 2022

Ui ux design trends that will dominate in 2021

Ninjabit ppt

Responsive Web Design Whitepaper

Careers In Web Design

Top 7 UI Design Trends For 2021 - 2022

Kony Visualizer Puts Mobile Apps Features Control in Hands of Those Closest t...

7 top UI UX Design Trends to follow in 2022.pptx

interaction design trends 2015 _ 2016

Plus de Codemotion

Fuzz-testing: A hacker's approach to making your code more secure | Pascal Ze...

Codemotion

Pompili - From hero to_zero: The FatalNoise neverending story

Codemotion

Pastore - Commodore 65 - La storia

Codemotion

Rivivere l'ebbrezza di progettare un vecchio computer o una consolle da bar è oggi possibile sfruttando le FPGA, ovvero logiche programmabili che consentono a chiunque di progettare il proprio hardware o di ricrearne uno del passato. In questa sessione si racconta come dal reverse engineering dell'hardware di vecchie glorie come il Commodore 64 e lo ZX Spectrum sia stato possibile farle rivivere attraverso tecnologie oggi alla portata di tutti.

Pennisi - Essere Richard Altwasser

Codemotion

There's a lot of talk about blockchain, but how does the technology behind it actually work? For developers, getting some hands-on experience is the fastest way to get familiair with new technologies. So let's build a blockchain, then! In this session, we're going to build one in plain old Java, and have it working in 40 minutes. We'll cover key concepts of a blockchain: transactions, blocks, mining, proof-of-work, and reaching consensus in the blockchain network. After this session, you'll have a better understanding of core aspects of blockchain technology.

Michel Schudel - Let's build a blockchain... in 40 minutes! - Codemotion Amst...

Codemotion

When was the last time you were truly lost? Thanks to the maps and location technology in our phones, a whole generation has now grown up in a world where getting lost is truly a thing of the past. Location technology goes far beyond maps in the palm of our hand, however. In this talk, we will explore how a ridesharing app works. How do we discover our destination?How do we find the closest driver? How do we display this information on a map? How do we find the best route?To answer these questions,we will be learning about a variety of location APIs, including Maps, Positioning, Geocoding etc.

Richard Süselbeck - Building your own ride share app - Codemotion Amsterdam 2019

Codemotion

Eward Driehuis, SecureLink's research chief, will guide you through the bumpy ride we call the cyber threat landscape. As the industry has over a decade of experience of dealing with increasingly sophisticated attacks, you might be surprised to hear more attacks slip through the cracks than ever. From analyzing 20.000 of them in 2018, backed by a quarter of a million security events and over ten trillion data points, Eward will outline why this happens, how attacks are changing, and why it doesn't matter how neatly or securely you code.

Eward Driehuis - What we learned from 20.000 attacks - Codemotion Amsterdam 2019

Codemotion

IoT revolution is ended. Thanks to hardware improvement, building an intelligent ecosystem is easier than never before for both startups and large-scale enterprises. The real challenge is now to connect, process, store and analyze data: in the cloud, but also, at the edge. We’ll give a quick look on frameworks that aggregate dispersed devices data into a single global optimized system allowing to improve operational efficiency, to predict maintenance, to track asset in real-time, to secure cloud-connected devices and much more.

Francesco Baldassarri - Deliver Data at Scale - Codemotion Amsterdam 2019 -

Codemotion

What if Virtual Reality glasses could transform your environment into a three-dimensional work of art in realtime in the style of a painting from Van Gogh? One of the many interesting developments in the field of Deep Learning is the so called "Style Transfer". It describes a possibility to create a patchwork (or pastiche) from two images. While one of these images defines the the artistic style of the result picture, the other one is used for extracting the image content. A team from TNG Technology Consulting managed to build an AI showcase using OpenCV and Tensorflow to realize such goggles.

Martin Förtsch, Thomas Endres - Stereoscopic Style Transfer AI - Codemotion A...

Codemotion

Blockchain (and Cryptocurrency) is an evolution of 20-year old research from scientists like Chaum, Lamport, and Castro & Liskov. Due to the current hype, it's hard to distinguish beneficial aspects of the technology from a desire for a "silver bullet" for device security, verifiable logistics, or "saving democracy". The problem: blockchain introduces new security challenges - and blind adoption without understanding reduces overall security. In this talk, Melanie Rieback and Klaus Kursawe explain the pitfalls and limits of blockchain, so you can avoid making your applications LESS secure.

Melanie Rieback, Klaus Kursawe - Blockchain Security: Melting the "Silver Bul...

Codemotion

Networking is a core part of computing in the digital world we inhabit. But, how well do you know how it works? Do you understand all the moving parts of the OSI stack inside your computer, and how the network is actually put together? How can this ever work? This guided safari of layers, standards, protocols, and happenstance will bring us close to the copper wire, and up through the layers of CDMA/CD, ARP, routing and HTTP. We will make a few excursions through patchworks that still work forty years later, and cleverly designed mechanisms that show that simplicity is the only way to last.

Angelo van der Sijpt - How well do you know your network stack? - Codemotion ...

Codemotion

Performance tests are not only an important instrument for understanding a system and its runtime environment. It is also essential in order to check stability and scalability – non-functional requirements that might be decisive for success. But won't my cloud hosting service scale for me as long as I can afford it? Yes, but… It only operates and scales resources. It won't automatically make your system fast, stable and scalable. This talk shows how such and comparable questions can be clarified with performance tests and how DevOps teams benefit from regular test practise.

Lars Wolff - Performance Testing for DevOps in the Cloud - Codemotion Amsterd...

Codemotion

Sascha will demonstrate the opportunities and challenges of Conversational AI learned from the practice. Both Technology and User Experience will be covered introducing a process finding micro-moments, writing happy paths, gathering intents, designing the conversational flow, and finally publishing on almost all channels including Voice Services and Chatbots. Valuable for enterprises, developers, and designers. All live on stage in just minutes and with almost no code.

Sascha Wolter - Conversational AI Demystified - Codemotion Amsterdam 2019

Codemotion

A key challenge we face at Pacmed is quickly calibrating and deploying our tools for clinical decision support in different hospitals, where data formats may vary greatly. Using Intensive Care Units as a case study, I’ll delve into our scalable Python pipeline, which leverages Pandas’ split-apply-combine approach to perform complex feature engineering and automatic quality checks on large time-varying data, e.g. vital signs. I’ll show how we use the resulting flexible and interpretable dataframes to quickly (re)train our models to predict mortality, discharge, and medical complications.

Michele Tonutti - Scaling is caring - Codemotion Amsterdam 2019

Codemotion

Coolblue is a proud Dutch company, with a large internal development department; one that truly takes CI/CD to heart. Empowerment through automation is at the heart of these development teams, and with more than 1000 deployments a day, we think it's working out quite well. In this session, Pat Hermens (a Development Managers) will step you through what enables us to move so quickly, which tools we use, and most importantly, the mindset that is required to enable development teams to deliver at such a rapid pace.

Pat Hermens - From 100 to 1,000+ deployments a day - Codemotion Amsterdam 2019

Codemotion

Quantum computers can use all of the possible pathways generated by quantum decisions to solve problems that will forever remain intractable to classical compute power. As the mega players vie for quantum supremacy and Rigetti announces its $1M "quantum advantage" prize, we live in exciting times. IBM-Q and Microsoft Q# are two ways you can learn to program quantum computers so that you're ready when the quantum revolution comes. I'll demonstrate some quantum solutions to problems that will forever be out of reach of classical, including organic chemistry and large number factorisation.

James Birnie - Using Many Worlds of Compute Power with Quantum - Codemotion A...

Codemotion

Chinese food exploded across America in the early 20th century, rapidly adapting to local tastes while also spreading like wildfire. How was it able to spread so fast? The GY6 is a family of scooter engines that has achieved near total ubiquity in Europe. It is reliable and cheap to manufacture, and it's made in factories across China. How are these factories able to remain afloat? Chinese-American food and the GY6 are both riveting studies in product-market fit, and both are the product of a distributed open source-like development model. What lessons can we learn for open source software?

Don Goodman-Wilson - Chinese food, motor scooters, and open source developmen...

Codemotion

Pieter Omvlee - The story behind Sketch - Codemotion Amsterdam 2019

Codemotion

Would you fly in a plane designed by a craftsman or would you prefer your aircraft to be designed by engineers? We are learning that science and empiricism works in software development, maybe now is the time to redefine what “Software Engineering” really means. Software isn't bridge-building, it is not car or aircraft development either, but then neither is Chemical Engineering. Engineering is different in different disciplines. Maybe it is time for us to begin thinking about retrieving the term "Software Engineering" maybe it is time to define what our "Engineering" discipline should be.

Dave Farley - Taking Back “Software Engineering” - Codemotion Amsterdam 2019

Codemotion

What is the job of a CTO and how does it change as a startup grows in size and scale? As a CTO, where should you spend your focus? As an engineer aspiring to be a CTO, what skills should you pursue? In this inspiring and personal talk, I describe my journey from early Red Hat engineer to CTO at Bloomon. I will share my view on what it means to be a CTO, and ultimately answer the question: Should the CTO be coding?

Joshua Hoffman - Should the CTO be Coding? - Codemotion Amsterdam 2019

Codemotion

Plus de Codemotion (20)