This document discusses moving from requirements to design in user interface development, including defining personas and scenarios, identifying functional and data requirements, sketching an interaction framework with navigation maps and wireframes, and prototyping designs. It provides an overview of the process and exercises for attendees to define requirements and sketch interaction frameworks for their own design ideas.
How do you make an entire service visible? And align frontstage customer experience with backstage business processes? April’s Service Design Drinks in Berlin gave an introduction to one of the most central delivery tools and artefact in service design. A comprehensive input was followed by a related hands-on session.
500 Startups UX Bootcamp - Talk to your Effin UsersRick Boardman
How do I test my new prototype? Which methods should I use? The dirty secret is that they all suck (-; Know their strengths and weaknesses - and triangulate!
How do you make an entire service visible? And align frontstage customer experience with backstage business processes? April’s Service Design Drinks in Berlin gave an introduction to one of the most central delivery tools and artefact in service design. A comprehensive input was followed by a related hands-on session.
500 Startups UX Bootcamp - Talk to your Effin UsersRick Boardman
How do I test my new prototype? Which methods should I use? The dirty secret is that they all suck (-; Know their strengths and weaknesses - and triangulate!
Product and UX - are the roles blurring?Jesse Gant
For most web-based companies, it appears that product managers have started to evolve their user experience (UX) skills in order to sell key concepts to developers, executives and even customers. On the flip side, UX folks contribute significant requirements and user stories in their design process and user research. So are the two roles becoming one? This covers the roles and why they are unique or not and even delves into the creation of annotated wireframes or prototypes instead of long-winded requirements docs - in an attempt to speed up the process to validate features and designs sooner rather than later with customers.
Presentation explains how wireframing technics which are used mainly by designers, can be used in software engineering process by mobile app developers.
From Use to User Interface- This 3-4 hour tutorial describes a practical approach to translating the goals users would like to achieve and the tasks they wish to accomplish into user interface designs that effectively support those goals and tasks.
A presentation I made for showing Alcatel-Lucent developers what usability is about and what simple techniques they could use in their development process.
Deliverables that Clarify, Focus, and Improve DesignBen Peachey
A talk given at the 2002 Annual Conference of the Usability Professionals' Association
Authors: Richard Fulcher, Bryce Glass, Matt Leacock
"The representations we choose for UI design affect both how we think about the design and how others understand it. Concept maps, wireframes, storyboards, and flow-maps speak to different audiences at different stages of the development cycle. This presentation provides examples of these documents and a toolkit for producing them."
source, examples and resources can be found at: http://leacock.com/deliverables/
Product and UX - are the roles blurring?Jesse Gant
For most web-based companies, it appears that product managers have started to evolve their user experience (UX) skills in order to sell key concepts to developers, executives and even customers. On the flip side, UX folks contribute significant requirements and user stories in their design process and user research. So are the two roles becoming one? This covers the roles and why they are unique or not and even delves into the creation of annotated wireframes or prototypes instead of long-winded requirements docs - in an attempt to speed up the process to validate features and designs sooner rather than later with customers.
Presentation explains how wireframing technics which are used mainly by designers, can be used in software engineering process by mobile app developers.
From Use to User Interface- This 3-4 hour tutorial describes a practical approach to translating the goals users would like to achieve and the tasks they wish to accomplish into user interface designs that effectively support those goals and tasks.
A presentation I made for showing Alcatel-Lucent developers what usability is about and what simple techniques they could use in their development process.
Deliverables that Clarify, Focus, and Improve DesignBen Peachey
A talk given at the 2002 Annual Conference of the Usability Professionals' Association
Authors: Richard Fulcher, Bryce Glass, Matt Leacock
"The representations we choose for UI design affect both how we think about the design and how others understand it. Concept maps, wireframes, storyboards, and flow-maps speak to different audiences at different stages of the development cycle. This presentation provides examples of these documents and a toolkit for producing them."
source, examples and resources can be found at: http://leacock.com/deliverables/
UiPath Test Automation using UiPath Test Suite series, part 3DianaGray10
Welcome to UiPath Test Automation using UiPath Test Suite series part 3. In this session, we will cover desktop automation along with UI automation.
Topics covered:
UI automation Introduction,
UI automation Sample
Desktop automation flow
Pradeep Chinnala, Senior Consultant Automation Developer @WonderBotz and UiPath MVP
Deepak Rai, Automation Practice Lead, Boundaryless Group and UiPath MVP
JMeter webinar - integration with InfluxDB and GrafanaRTTS
Watch this recorded webinar about real-time monitoring of application performance. See how to integrate Apache JMeter, the open-source leader in performance testing, with InfluxDB, the open-source time-series database, and Grafana, the open-source analytics and visualization application.
In this webinar, we will review the benefits of leveraging InfluxDB and Grafana when executing load tests and demonstrate how these tools are used to visualize performance metrics.
Length: 30 minutes
Session Overview
-------------------------------------------
During this webinar, we will cover the following topics while demonstrating the integrations of JMeter, InfluxDB and Grafana:
- What out-of-the-box solutions are available for real-time monitoring JMeter tests?
- What are the benefits of integrating InfluxDB and Grafana into the load testing stack?
- Which features are provided by Grafana?
- Demonstration of InfluxDB and Grafana using a practice web application
To view the webinar recording, go to:
https://www.rttsweb.com/jmeter-integration-webinar
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Ramesh Iyer
In today's fast-changing business world, Companies that adapt and embrace new ideas often need help to keep up with the competition. However, fostering a culture of innovation takes much work. It takes vision, leadership and willingness to take risks in the right proportion. Sachin Dev Duggal, co-founder of Builder.ai, has perfected the art of this balance, creating a company culture where creativity and growth are nurtured at each stage.
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Tobias Schneck
As AI technology is pushing into IT I was wondering myself, as an “infrastructure container kubernetes guy”, how get this fancy AI technology get managed from an infrastructure operational view? Is it possible to apply our lovely cloud native principals as well? What benefit’s both technologies could bring to each other?
Let me take this questions and provide you a short journey through existing deployment models and use cases for AI software. On practical examples, we discuss what cloud/on-premise strategy we may need for applying it to our own infrastructure to get it to work from an enterprise perspective. I want to give an overview about infrastructure requirements and technologies, what could be beneficial or limiting your AI use cases in an enterprise environment. An interactive Demo will give you some insides, what approaches I got already working for real.
Epistemic Interaction - tuning interfaces to provide information for AI supportAlan Dix
Paper presented at SYNERGY workshop at AVI 2024, Genoa, Italy. 3rd June 2024
https://alandix.com/academic/papers/synergy2024-epistemic/
As machine learning integrates deeper into human-computer interactions, the concept of epistemic interaction emerges, aiming to refine these interactions to enhance system adaptability. This approach encourages minor, intentional adjustments in user behaviour to enrich the data available for system learning. This paper introduces epistemic interaction within the context of human-system communication, illustrating how deliberate interaction design can improve system understanding and adaptation. Through concrete examples, we demonstrate the potential of epistemic interaction to significantly advance human-computer interaction by leveraging intuitive human communication strategies to inform system design and functionality, offering a novel pathway for enriching user-system engagements.
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Jeffrey Haguewood
Sidekick Solutions uses Bonterra Impact Management (fka Social Solutions Apricot) and automation solutions to integrate data for business workflows.
We believe integration and automation are essential to user experience and the promise of efficient work through technology. Automation is the critical ingredient to realizing that full vision. We develop integration products and services for Bonterra Case Management software to support the deployment of automations for a variety of use cases.
This video focuses on the notifications, alerts, and approval requests using Slack for Bonterra Impact Management. The solutions covered in this webinar can also be deployed for Microsoft Teams.
Interested in deploying notification automations for Bonterra Impact Management? Contact us at sales@sidekicksolutionsllc.com to discuss next steps.
DevOps and Testing slides at DASA ConnectKari Kakkonen
My and Rik Marselis slides at 30.5.2024 DASA Connect conference. We discuss about what is testing, then what is agile testing and finally what is Testing in DevOps. Finally we had lovely workshop with the participants trying to find out different ways to think about quality and testing in different parts of the DevOps infinity loop.
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualityInflectra
In this insightful webinar, Inflectra explores how artificial intelligence (AI) is transforming software development and testing. Discover how AI-powered tools are revolutionizing every stage of the software development lifecycle (SDLC), from design and prototyping to testing, deployment, and monitoring.
Learn about:
• The Future of Testing: How AI is shifting testing towards verification, analysis, and higher-level skills, while reducing repetitive tasks.
• Test Automation: How AI-powered test case generation, optimization, and self-healing tests are making testing more efficient and effective.
• Visual Testing: Explore the emerging capabilities of AI in visual testing and how it's set to revolutionize UI verification.
• Inflectra's AI Solutions: See demonstrations of Inflectra's cutting-edge AI tools like the ChatGPT plugin and Azure Open AI platform, designed to streamline your testing process.
Whether you're a developer, tester, or QA professional, this webinar will give you valuable insights into how AI is shaping the future of software delivery.
State of ICS and IoT Cyber Threat Landscape Report 2024 previewPrayukth K V
The IoT and OT threat landscape report has been prepared by the Threat Research Team at Sectrio using data from Sectrio, cyber threat intelligence farming facilities spread across over 85 cities around the world. In addition, Sectrio also runs AI-based advanced threat and payload engagement facilities that serve as sinks to attract and engage sophisticated threat actors, and newer malware including new variants and latent threats that are at an earlier stage of development.
The latest edition of the OT/ICS and IoT security Threat Landscape Report 2024 also covers:
State of global ICS asset and network exposure
Sectoral targets and attacks as well as the cost of ransom
Global APT activity, AI usage, actor and tactic profiles, and implications
Rise in volumes of AI-powered cyberattacks
Major cyber events in 2024
Malware and malicious payload trends
Cyberattack types and targets
Vulnerability exploit attempts on CVEs
Attacks on counties – USA
Expansion of bot farms – how, where, and why
In-depth analysis of the cyber threat landscape across North America, South America, Europe, APAC, and the Middle East
Why are attacks on smart factories rising?
Cyber risk predictions
Axis of attacks – Europe
Systemic attacks in the Middle East
Download the full report from here:
https://sectrio.com/resources/ot-threat-landscape-reports/sectrio-releases-ot-ics-and-iot-security-threat-landscape-report-2024/
Neuro-symbolic is not enough, we need neuro-*semantic*Frank van Harmelen
Neuro-symbolic (NeSy) AI is on the rise. However, simply machine learning on just any symbolic structure is not sufficient to really harvest the gains of NeSy. These will only be gained when the symbolic structures have an actual semantics. I give an operational definition of semantics as “predictable inference”.
All of this illustrated with link prediction over knowledge graphs, but the argument is general.
Accelerate your Kubernetes clusters with Varnish CachingThijs Feryn
A presentation about the usage and availability of Varnish on Kubernetes. This talk explores the capabilities of Varnish caching and shows how to use the Varnish Helm chart to deploy it to Kubernetes.
This presentation was delivered at K8SUG Singapore. See https://feryn.eu/presentations/accelerate-your-kubernetes-clusters-with-varnish-caching-k8sug-singapore-28-2024 for more details.
2. overview
➝ 1st review
➝ where are we now – what would we ideally do?
➝ introduction of personas
➝ match personas to ideas
➝ personas expectations (should revisit interviews)
➝ brainstorm - each idea receives five minutes.
➝ context scenarios
workshop
➝ data & functional requirements (three tasks)
➝ functional groups and hierarchies
➝ sketch interaction frame work
➝ patterns bottom-up
3. UX benchmarking
➝ What is the core concept?
➝ What kinds of UX targets might they
have?
➝ What kinds of tasks can users
your
perform with the application?
competitor
product
➝ What kind of UI solutions are there for
certain tasks?
➝ What are task times and task steps?
➝ What kind of visual design styles and
solutions are being used?
4. context of use
}
people
places
things
MOBILE
time CONTEXT
culture
5. prototypes
What I hear, I forget.
What I see, I remember.
What I do, I understand.
(Laotse 604 BC)
Language is convincing.
Seeing is believing.
Touching is reality.
(Alan Kay)
6. prototyping
➝ visualize and simulate the concept
➝ representation of "
all or part of the UI
➝ for simulating the functionality of
the UI
➝ use appropriate level of simulations
or prototypes for the purpose
7. prototypes
can be a
➝ paper-prototype (hand made)
➝ screenshots
➝ computer/terminal-based prototype
➝ flash demo
➝ anything that is complete enough that it is possible for
users to follow through the main task flow
➝ movie
8. from requirements to design
➝ this lecture is based on Cooper (2007) and Forum Nokia’s
interaction design module
10. requirements definition
➝ creating problem and vision statements
➝ brainstorming
➝ identifying persona expectations
➝ attitudes,aspirations, social, cultural, environmental factors
➝ general expectations and desires
➝ behaviour desired from the product
➝ how does the persona think about basic elements of data"
(e.g. email: message and people)
➝ constructing context scenarios
➝ identifying requirements"
object, action, context"
data and functional requirements"
business, brand, experience, technical, customer and
partner (3rd party)
11. exercise
➝ for your design idea define requirements"
object, action, context
➝ 5min alone
➝ 5min in pairs with feedback
12. defining the interaction framework
how is the product structured and how does it behave to
meet user goals
➝ define form factor, posture and input methods
➝ define data and functional elements
➝ determine functional groups and hierarchy
➝ sketch the interaction framework
➝ construct key path scenario
➝ check designs with validation scenarios
13. step 1: !
factor, posture and input methods
➝ form factor"
smart phone, PC, kiosk system
➝ posture"
how much attention will user devote to interacting with product – how
does the product behave in response (should be based on usage
contexts and environments)
➝ input"
more on that in mobile i/o lecture, touch screen, numerical keypad,
voice etc.
14. step 1:!
exercise
➝ define form factor, posture and input methods for your design idea
➝ 5min alone
➝ 5min in pairs
15. step 2:!
functional and data elements
➝ data elements
➝ e.g. pictures e-mails, SMS etc. and their important attributes clear from
scenario
➝ their relationships (grouped, sub-structure)
➝ functional elements (operations on them)"
e.g. for Vivien scenario (see moodle) needs to reach contacts by"
voice activation, assignable quick-dial buttons, select contact from list,
select contact from header of email, memo, appointment, auto-
assignment of a call button in proper context (upcoming appointment)
➝ check with context scenario what solution would:
➝ accomplish user goals most efficiently,
➝ best fit design principles,
➝ fit technology and cost parameters,
➝ other requirements?
➝ pretend the product is human
➝ apply principles and patterns
16. step 2:!
exercise
➝ define data and functional elements for your design idea - at least
three tasks should be supported
➝ 5min alone
➝ 5min discuss in pairs
17. step 3: !
functional groups and hierarchies
➝ what needs a lot of screen estate?
➝ which elements contain others?
➝ how to arrange containers to optimize flow?
➝ which elements are used together, which aren t?
➝ in what sequence will they be used?
➝ what interaction principles and patterns apply?
➝ how does the personas mental model affect organization?
18. step 4:!
sketch the interaction framework
➝ time for rectangles – on whiteboards (plus camera)
➝ one or two people together – one thinks in terms of the narrative of
the design
➝ boxes represent functional group and/or container
➝ what is the central screen – how can you get there from within and
without?
19. steps for interaction design
➝ design the UI structure of the application
➝ document it as a navigation map of the application s views
Note: Ideally this is
UX
already a part of the
application s UI
concept.
contact contact
list view
find mode
edit contact popup
contact details
view
view
delete confirmation
contact
history view
Task flow should utilize the
views/services of other
applications, when available.
alerting call message Email skype
Design it accordingly.
view
editor view
editor view
chat view
✱Navigation map of an imaginary Contacts application.
20. exercise
➝ sketch with a pen and paper the following interaction as a navigation
tree: carry out the task that resembles most your design idea on your
mobile phone (enter an event into the calendar, receive SMS)
➝ what kind of alternative interactions (e.g. short-cuts) are provided?
➝ compare the interaction of your device to your colleague s devices
5-10min (alone)
5-10min (all/discussion)
21. wireframe examples
➝ hand drawn sketches
➝ Quick and fast reviews
➝ Encourage experimentation and honest critique
➝ annotated wireframes
➝ describe the functional elements
➝ elements are explained
➝ annotations enables the wireframe to be
understood
➝ high fidelity wireframes
➝ includes images, colors, fonts well thought
22. value at later stages
ID
General
description
Use both illustrations
and texts to
Purpose
communicate the
interaction design.
Access from
Contents
Menu
Functionality
Exceptions
23. wireframe examples
Sketches of 12:45 3G
Take
m e
home 12:45 3G
Traveling
schedule 12:45 3G
Take
m e
home
the screens
Take
bus
12,
direction
Lentoasema
In
3
m inutes
Take
m e
home Get
off
a t
“Rautatieasema,
Oulu” Take
m e
home
In
12
m inutes
Walk
to
“Rautatieasema,
Oulu”
In
15
m inutes
Home Take
train
I C226,
direction
Helsinki Home
Åkerlundinkatu
11,
Tampere In
34
m inutes Åkerlundinkatu
11,
Tampere
Here Get
off
a t
“Rautatieasema,
Tampere” Here
In
5
hours,
33
m inutes
Häämentie
19,
Oulu Häämentie
19,
Oulu
l
C a n ce
12:45 Take
m e
home
fe
3G
Sa
matic
Home
el
nc
Descriptions of
Ca
Åkerlundinkatu
11 e
home
Auto
Take
m
33100
Tampere interaction between
the screens
Safe
Home
Åkerlundinkatu,
Tampere
Done
12:45 3G
Take
m e
home 12:45 3G
Take
m e
home
Here
Hämeentie
19Take
m e
home Take
m e
home
98100
Oulu
Home Refresh
via
GPS Home
Åkerlundinkatu,
Tampere Åkerlundinkatu
11,
Tampere
Done Here
Häämentie
19,
Oulu
➝ a wireframe map showing an overview of all the screens and the
interactions between them
25. step 5:!
key path scenarios
➝ depict primary pathways (that persona takes with greatest frequency,
often)
➝ focus on task level
➝ must describe in detail each major interaction with the system
➝ storyboarding + key path scenario narrative – e.g. in powerpoint, pdf
to feel the flow
26. step 6:!
check designs with validation scenarios
➝ key path variants"
less travelled, common exceptions, secondary persona needs
➝ necessary use scenarios"
necessary but infrequent
➝ edge cases"
atypical cases that must be handled
27. writing the design documents
➝ agree about the tools
➝ agree about the level of design
➝ “Standard” MS Office details and used file formats
products: Visio, Word, ➝ concepts (ppt)
PowerPoint
➝ light UI (Visio)
➝ other professional tools
➝ complete UI specification
➝ shareware tools
(Word with Visio images)
28. visual design framework
➝ in our case: stick to the visual style and language on the target device
➝ colour coding
➝ legibility
➝ branding
➝ look and feel
➝ apply to screen archetype
31. some mobile UI guidelines
GUIDELINES
LINKS
Forum Nokia
http://www.forum.nokia.com/
(Nokia Series 40, Nokia Series 60)
Tools_Docs_and_Code/Documentation/
Usability/
UI_Style_and_Visual_Guidelines.xhtml
UIQ (Sony Ericsson, Motorola)
http://developer.uiq.com/
Windows Mobile
http://developer.windowsmobile.com/
Android
http://developer.android.com/index.html
iPhone
http://developer.apple.com/iphone/
dotMobi Mobile Web Developers http://mobiforge.com/designing/blog/
Guide)
web-developers-guide-released
32. UI design patterns
➝ example sources of general UI design patterns
➝ usability.gov/pdfs/guidelines.html Research Based Guidelines
➝ welie.com Patterns in Interaction Design
➝ designinginterfaces.com Patterns by Jenifer Tidwell
➝ ui-patterns.com Patterns by Anders Toxboe
➝ patterntap.com Pattern Tap
➝ quince.infragistics.com UX Patterns Explorer
➝ androidpatterns.com