Prototyping in smart product design: Investigating prototyping tools to support communication in the early stage smart product development

Figures & data

Figure 1. Three core elements of the SP adapted from (Porter & Heppelmann, 2015).

Figure 2. The dimensions of fidelity adapted from (McCurdy et al., 2006) and (Fiorineschi & Rotini, 2019).

Table 1. Typical prototyping tool characteristics with respect to the characteristics of SPs.

Tools	Form	Functionality	Interactivity	Environment
Hand sketches	-
Digital sketches	-
Flowcharts	-	-
Storyboard		-	-	-
Cardboard	-	-	-
LEGO	-	-	-
Clay/Foam	-
Wireframe	-	-	-
User journey		-	-
3D printing	-	-	-
CAD	-	-
AR	-		-
VR		-		-

Figure 3. The flow diagram of survey 1.

Figure 4. Occupation distribution in Survey 1.

Table 2. Prototyping tools used for communicating concepts with members from other disciplines.

	SP Group						TP Group
	Frequency			Satisfaction			Frequency			Satisfaction
	%		$\bar{x}$	%		$\bar{x}$	%		$\bar{x}$	%		$\bar{x}$
	5	1		5	1		5	1		5	1
Hand sketches	32%	5%	3.61	34%	0%	4.06	36%	6%	3.61	13%	0%	3.90
Digital sketches	16%	8%	3.39	33%	0%	4.27	18%	18%	2.97	19%	0%	3.92
Flowcharts	22%	8%	3.43	21%	0%	3.82	24%	21%	2.97	20%	0%	3.67
Storyboard	11%	19%	2.65	7%	3%	3.34	12%	36%	2.58	15%	0%	3.70
Cardboard	3%	19%	2.38	7%	0%	3.25	3%	31%	2.16	14%	0%	3.57
LEGO	5%	59%	1.89	36%	0%	3.64	0%	58%	1.70	7%	0%	3.57
Clay/Foam	6%	33%	2.14	4%	4%	3.39	3%	58%	1.88	0%	0%	3.29
Wireframe	13%	16%	2.71	16%	3%	3.68	9%	45%	2.33	0%	0%	2.86
User journey	3%	26%	2.63	22%	0%	3.37	16%	34%	2.69	12%	0%	3.58
3D printing	17%	6%	3.47	30%	0%	4.09	9%	30%	2.61	30%	0%	3.70
CAD	31%	0%	3.83	57%	0%	4.37	35%	15%	3.62	43%	0%	4.21
AR	9%	38%	2.44	30%	5%	3.60	0%	64%	1.64	9%	0%	3.73
VR	6%	31%	2.69	35%	0%	4.00	0%	70%	1.48	0%	0%	3.56

Frequency: Scale 5 means ‘Always’ (multiple times in every project), Scale 1 means ‘Never use’. Satisfaction: Scale 5 means Extremely satisfied, while Scale 1 means Extremely unsatisfied.).

Figure 5. Four-quadrant chart.

Figure 6. Four groups of four-quadrant chart.

Figure 7. Tree diagram for the thirteen tools (two variables: frequency and satisfaction).

Figure 8. The average of tool dimensions (To what extent that these dimensions of fidelity influence your use of different prototyping tools).

Figure 9. Tree diagram for these 13 tools (4 variables: frequency, satisfaction, interactivity, environment).

Table 3. The elements of the user journey, wireframe and storyboard.

Tools	Elements	Description
User journey (Maioli, 2018)	Personas	The character(s) represent user needs, goals, thoughts, feelings, opinions, expectations, and pain points.
	Timeline	A finite amount of time or variable phases.
	Emotions	The feelings experienced by the user at a given moment in time.
	Touch points	What customers are doing, their actions and interactions with the organization.
	Channels	Where interaction takes place (the context of use)
Wireframe (Canziba, 2018)	Structure	Elements of user interface components – how they are structured and where they are placed.
	Content	A list of components, elements, images or text for product design/element within the structure.
	Information hierarchy	The organization of the information presented to the user.
	Functionality	How the user interface will work, how elements are connected, and how the users complete tasks using this UI
	Behavior	How the elements interact with users, how the user interface behaves, and how users can act with the UI
Storyboard (UX studio, 2019)	Character	the specific persona involved in your story defines the main actor’s characteristics, expectations, and overall attitude.
	Scene	The place (environment) and setting in which the story takes place.
	Plot Steps	Narrative the pieces of problems, events, and solutions occurring during the story.
	Emotions	The feelings experienced by the user at a given moment in time.
	Scene details	Additional details to rich the story.

Figure 10. The flow diagram of survey 2.

Figure 11. Frequency of using user journey, wireframe and storyboard in a different occupation.

Table 4. Results of one-way ANOVA of the design discipline groups’ preference for user journeys.

Source	Square sum	DOF	Square mean	F	P-value
Between groups	.510	3	.170	.429	.733
Within groups	38.080	96	.397
Total	38.590	99

Table 5. Results of one-way ANOVA of the design discipline groups’ preference for wireframes.

Source	Square sum	DOF	Square mean	F	P-value
Between groups	.350	3	.117	.231	.874
Within groups	48.400	96	.504
Total	48.750	99

Table 6. Results of one-way ANOVA of the design discipline groups’ preference for storyboards.

Source	Square sum	DOF	Square mean	F	P-value
Between groups	4.240	3	1.413	3.176	.028
Within groups	42.720	96	.445
Total	46.960	99

Table 7. Result for four design discipline groups’ preference for storyboards, significant differences in bold.

		Mean difference	Std. error	Sig.
UI/UX designer	Interaction designer	−.200	.189	.292
	Industrial designer	.280	.189	.141
	Product designer	−.240	.189	.206
Interaction designer	UI/UX designer	.200	.189	.292
	Industrial designer	.480*	.189	.013
	Product designer	−.040	.189	.833
Industrial designer	UI/UX designer	−.280*	.189	.141
	Interaction designer	−.480*	.189	.013
	Product designer	−.520*	.189	.007
Product designer	UI/UX designer	.240	.189	.206
	Interaction designer	.040	.189	.833
	Industrial designer	.520*	.189	.007

*The mean difference is significant at the 0.05 level.

Figure 12. Elements of prototyping tools ranked by UI/UX designers according to their importance in communicating the interactivity (green) and environment (yellow) qualities of a design.

Figure 13. Elements of prototyping tools ranked by interaction designers according to their importance in communicating the interactivity (green) and environment (yellow) qualities of a design.

Figure 14. Elements of prototyping tools ranked by industrial designers according to their importance in communicating the interactivity (green) and environment (yellow) qualities of a design.

Figure 15. Elements of prototyping tools ranked by product designers according to their importance in communicating the interactivity (green) and environment (yellow) qualities of a design.

Table 8. The summary of key elements (ranking) in these tools.

Occupation	User journey			Wireframe			Storyboard
Interactivity	1^st	2^nd	3^rd	1^st	2^nd	3^rd	1^st	2^nd	3^rd
UI/UX designer	Personas	Timeline	Touch points	Structure	Functionality	Information hierarchy	Character	Scene	Plot steps
Interaction designer	Personas	Timeline	Emotions	Content	Structure	Information hierarchy	Character	Scene	Plot steps
Industrial designer	Personas	Timeline	Emotions	Structure	Content	Information hierarchy	Character	Scene	Plot steps
Product designer	Personas	Timeline	Touch points	Structure	Content	Functionality	Character	Scene	Plot steps
Environment	1^st	2^nd	3^rd	1^st	2^nd	3^rd	1^st	2^nd	3^rd
UI/UX designer	Personas	Timeline	Touch points	Structure	Information hierarchy	Content	Character	Scene	Scene details
Interaction designer	Personas	Timeline	Emotions	Structure	Content	Functionality	Character	Scene	Plot steps
Industrial designer	Personas	Timeline	Emotions	Structure	Content	Information hierarchy	Character	Scene	Plot steps
Product designer	Personas	Timeline	Touch points	Structure	Content	Functionality	Character	Scene	Plot steps

Table 9. Coding scheme.

Coding level 1	Coding level 2 (Codes)	Coding level 3 (Sub codes)
Agreement: Yes/No
Additional elements	Prototype related factors (The qualities/characteristics of the prototype)	Visualizing: like fidelity of prototype, the geometry of prototype Function: Related functions of the prototype Hardware & System factor: The specific environment of the prototype: e.g., hardware, software, system environment (system here related to Smart Product-Service Systems: a service with the product to jointly address the needs of consumers) Community factor: The environment in which the prototype interacts with other devices Psychological factor: Designers’ psychological activities (like creativity mindset: converge/diverge) in prototyping
	User related factors User operation factors include user experience, user feedback, user process (process of using the product/prototype), etc.
	Process related factors It mainly emphasizes the process (input-output/timing) of designing/prototyping, including design guidelines, design steps, etc.

Table 10. The values represent the number of designers citing each code (interactive qualities).

Codes		UI/UX	Interaction	Industrial	Product
User related		7	6	4	7
Prototype related	Function	3	4	1	6
	Visualization	2	0	1	1
Process related		3	4	0	0

Table 11. The value represents the number of designers citing each code (Environmental qualities).

Codes		UI/UX designer	Interaction	Industrial	Product
User related		2	1	2	1
Prototype related	Hardware & System	3	3	3	1
	Community	0	2	1	2
	Psychological	1	1	0	0

Porter, M. E., & Heppelmann, J. E. (2015). How smart, connected products are transforming companies. Harvard Business Review, 93(10), 96–114. https://hbr.org/2015/10/how-smart-connected-products-are-transforming-companies

 Web of Science ®Google Scholar

McCurdy, M., Connors, C., Pyrzak, G., Kanefsky, B., & Vera, A. (2006). Breaking the fidelity barrier: An examination of our current characterization of prototypes and an example of a mixed-fidelity success. Proceedings of the SIGCHI conference on Human Factors in computing systems, Montréal, Québec, Canada.

 Google Scholar

Fiorineschi, L., & Rotini, F. (2019, August 5–8). Unveiling the multiple and complex faces of fidelity. Proceedings of the Design Society: International Conference on Engineering Design, Delft, The Netherlands.

 Google Scholar

Maioli, L. (2018). Fixing bad UX designs: Master proven approaches, tools, and techniques to make your user experience great again. Packt Publishing Ltd.

 Google Scholar

Canziba, E. (2018). Hands-on UX design for developers: Design, prototype, and implement compelling user experiences from scratch. Packt Publishing Ltd.

 Google Scholar

UX studio. (2019). UX Storyboard Creation: A Complete Guide For Beginners https://uxstudioteam.com/ux-blog/ux-storyboard/

 Google Scholar