Balancing Creativity with User Testing -- Designer vs. Developer #2

Chrome for Developers · Intermediate ·🛠️ AI Tools & Apps ·9y ago

Key Takeaways

Discusses balancing creativity with user testing with Ewa Gasperowicz, a Front End Developer on the Google Developer Relations Team

Full Transcript

[Music] designers feel that the creative process has become quite sterile uh like ux has sort of taking away the kind of the creativeness of it so before um a designer would go to art college um and everything about that was uh the creative process was coming internally but now everything seems to be validated and everything seems to be like very sterile and the way we create things is all about replicating the same user experience patterns and UI elements um and it feels like the validation part has taken away what it means to be creative like from developer perspective I must say data is very helpful um so I personally like it I like to you know have hard proof that what I'm working on or the decisions I'm making are having the the right impact on the user experience on the app I'm building or on the look and field but I can totally see where coming from uh when it comes to the creative process for example it's quite important and easy to measure stuff that is already out there to figure out if this decision was right or wrong but it's very hard to start with data you know to start the process of creating something new uh from hard facts you need this inity that you put into the app in the first place for example when I create some uh reference app um I want to showcase some techn technology or some new way of solving technological problem um but it's a front end up so I need to make it look and feel nice at the same time and I stand in this blank canvas and then I pray to have some creative designer next to me you know coming in with his inity rather than uh just you know getting my data and following the data flow I mean it does feel a bit like a chicken and egg situation what comes first the creative step of just Discovery I actually like to think about it as a sandwich you know rather than chicken and egg it's like you you have some bread and then some feeling and then some bread again so I think it all starts with kind of creative process um by designer or by some you know creative person that is working on a given product um to have a the starting idea and then you get data and user testing and all this you know heavy Weaponry for um polishing the original idea so that it's the best um you can get but then at the top top you still need this touch of inity you know like when I think about different um visual Frameworks on the web they kind of stop at this second layer they took the initial idea they applied a lot of data to make it as nice and you know to use and as usable and as browser friendly environment friendly whatever um you need and they stop there but then the design need to take such a visual framework and touch this something unique you know that to make a given app or product outstanding and and sometimes I think we stop at this data level and we don't go through this extra step of adding some more art on top of it to make it extraordinary amazing I mean I've never really thought that always feels like one comes before the other and I know um a lot of working environments do feel like a factory in that respect that I draw the picture then a developer might implement the picture and then I take it back and say could you change the color back and um but I think I suppose it's about finding a process where both can really feel like they're making a sandwich together in a kitchen rather than it being a conveyor belt it's a little bit similar to when the agile methodologies entered the software world you know where you go through different iterations of the um of the creative process and I agree when there was the situation where first you get get a design out and then you give it to developers to implement it and that's it it's very stressful for both sides because um developers we stressed that the design is not really implementable to be honest like it's not compatible with the technology and then designers are angry because you know developers changed their design and now it's not as pretty as it was before so I think it's all about making it more iterative and more collaborative and then it takes the stress out of both parties and I know there are some there's some tension on on the line every now and then um but to be honest I really like working with designers um there's this app I worked on um in December last year it's Santa Tracker it's um it's a Google app that U kind of tracks the steps of the Santa Claus throughout December up to the culmination day where he goes around the world you know and gives the presents um and there's a lot of apps you can play um in that experience throughout um whole December and I was developing this this up where a little um elf is going through a maze is navigating a maze finding presents and you can look like the you see the elf from the top so it's pretty much just a red dot with a little pointy hat uh kind of and my task was to make it jump through obstacles and I was totally stuck you know because you look from above and it's just this red dot that is ahead how you make a jump like you don't don't see legs you don't see arms I was I was stuck I implemented all the technological parts to it in two days and then for next two weeks I was like blank H how to make it look right and then I asked for designer help and within very short time he came up with the idea that you know if you make the dot bigger and they smaller it looks like you know it's like floating in the air and then falling down this is so brilliant and I never thought about it like you really need to um trust in your competencies you know and ask for help where you need it and what I'd love for us to do is to end up in a world where we have language and ideas that are native to the web itself that embrace the fact that the web is hypertext not just a another way to build native apps

Original Description

Welcome to Designer vs. Developer, a show that tries to solve the challenges faced in the industry by opening a conversation between the two, providing take aways, solutions to workflows, tools & discussions on everyday struggles. This week Mustafa speaks to Ewa Gasperowicz, Front End Developer on the Google Developer Relations Team, about whether the UX movement has over regulated the creative process and how we can bring back that sparkle into a project by making sandwiches. You can listen to an extended version of our conversation downloading our podcast https://developers.google.com/web/shows/designer-vs-developer/podcast/DVDS1E02-balancing-creativity-with-user-testing Read our blog post here: https://medium.com/dev-channel/finding-the-spot-where-art-and-science-meet-b6a4ca3e46bc#.qn6eyk3os Mustafa is a Design Advocate at Google and has over 16 years experience working UX and visual designer. You can follow him at http://www.twitter.com/mustafa_x/ Lean more about the subjects mentioned in our video - The App Shell Model: https://developers.google.com/web/fundamentals/architecture/app-shell Santa Tracker: https://santatracker.google.com Santa Tracker Code Lab: https://santatracker.google.com/codelab.html Watch more Designer vs. Developer videos here: https://goo.gl/0GOEy4 Subscribe to the Chrome Developers Channel: http://goo.gl/LLLNvf Watch the rest of the series: https://goo.gl/eIk8r6
Watch on YouTube ↗ (saves to browser)
Sign in to unlock AI tutor explanation · ⚡30

Playlist

Uploads from Chrome for Developers · Chrome for Developers · 0 of 60

← Previous Next →
1 Polymer Performance Patterns (The Polymer Summit 2015)
Polymer Performance Patterns (The Polymer Summit 2015)
Chrome for Developers
2 Polymer Power Tools (The Polymer Summit 2015)
Polymer Power Tools (The Polymer Summit 2015)
Chrome for Developers
3 Chrome Dev Summit 2014 – Chrome Case Studies
Chrome Dev Summit 2014 – Chrome Case Studies
Chrome for Developers
4 Web Directions Code 2015 round up
Web Directions Code 2015 round up
Chrome for Developers
5 Maintainable Code - HTTP203
Maintainable Code - HTTP203
Chrome for Developers
6 iron-ajax… wat?! -- Polycasts #26
iron-ajax… wat?! -- Polycasts #26
Chrome for Developers
7 The Guardian - Supercharged
The Guardian - Supercharged
Chrome for Developers
8 ES2015 (next version of JavaScript), Totally Tooling Tips (S2 Ep1)
ES2015 (next version of JavaScript), Totally Tooling Tips (S2 Ep1)
Chrome for Developers
9 #AskPolymer: Rob answers all the questions ever -- Polycasts #27
#AskPolymer: Rob answers all the questions ever -- Polycasts #27
Chrome for Developers
10 The Future of JavaScript - HTTP203
The Future of JavaScript - HTTP203
Chrome for Developers
11 Data Binding 101 -- Polycasts #28
Data Binding 101 -- Polycasts #28
Chrome for Developers
12 The Guardian part 2 - Supercharged
The Guardian part 2 - Supercharged
Chrome for Developers
13 The Future of Web Audio: with Chris Wilson and Chris Lowis
The Future of Web Audio: with Chris Wilson and Chris Lowis
Chrome for Developers
14 Chrome 46: New motion-path animations, client hints and service worker improvements
Chrome 46: New motion-path animations, client hints and service worker improvements
Chrome for Developers
15 Sublime Snippets, Totally Tooling Tips (S2 Ep2)
Sublime Snippets, Totally Tooling Tips (S2 Ep2)
Chrome for Developers
16 #AskPolymer: How do you make the show? -- Polycasts #29
#AskPolymer: How do you make the show? -- Polycasts #29
Chrome for Developers
17 Critical Path CSS, Totally Tooling Tips (S2 Mini Tip #1)
Critical Path CSS, Totally Tooling Tips (S2 Mini Tip #1)
Chrome for Developers
18 Binding to Objects -- Polycasts #30
Binding to Objects -- Polycasts #30
Chrome for Developers
19 Player FM - Supercharged
Player FM - Supercharged
Chrome for Developers
20 Where’s the Designer? #AskPolymer -- Polycasts #31
Where’s the Designer? #AskPolymer -- Polycasts #31
Chrome for Developers
21 Jake Beats Wikipedia - HTTP203
Jake Beats Wikipedia - HTTP203
Chrome for Developers
22 Supercharged Observers! -- Polycasts #32
Supercharged Observers! -- Polycasts #32
Chrome for Developers
23 Jai's Web blog - Supercharged
Jai's Web blog - Supercharged
Chrome for Developers
24 Windows Command-line Tooling, Totally Tooling Tips (S2, Ep4)
Windows Command-line Tooling, Totally Tooling Tips (S2, Ep4)
Chrome for Developers
25 What about internationalization? #AskPolymer -- Polycasts #33
What about internationalization? #AskPolymer -- Polycasts #33
Chrome for Developers
26 Developing for Billions (Chrome Dev Summit 2015)
Developing for Billions (Chrome Dev Summit 2015)
Chrome for Developers
27 Google+ Performance Improvement Comparison
Google+ Performance Improvement Comparison
Chrome for Developers
28 Deploying HTTPS: The Green Lock and Beyond (Chrome Dev Summit 2015)
Deploying HTTPS: The Green Lock and Beyond (Chrome Dev Summit 2015)
Chrome for Developers
29 Progressive Web Apps (Chrome Dev Summit 2015)
Progressive Web Apps (Chrome Dev Summit 2015)
Chrome for Developers
30 Instant Loading with Service Workers (Chrome Dev Summit 2015)
Instant Loading with Service Workers (Chrome Dev Summit 2015)
Chrome for Developers
31 Increase Engagement with Web Push Notifications (Chrome Dev Summit 2015)
Increase Engagement with Web Push Notifications (Chrome Dev Summit 2015)
Chrome for Developers
32 Engaging with the Real World: Web Bluetooth and Physical Web (Chrome Dev Summit 2015)
Engaging with the Real World: Web Bluetooth and Physical Web (Chrome Dev Summit 2015)
Chrome for Developers
33 Asking for Permission: respectful, opinionated UI (Chrome Dev Summit 2015)
Asking for Permission: respectful, opinionated UI (Chrome Dev Summit 2015)
Chrome for Developers
34 Polymer - State of the Union (Chrome Dev Summit 2015)
Polymer - State of the Union (Chrome Dev Summit 2015)
Chrome for Developers
35 Building Progressive Web Apps with Polymer (Chrome Dev Summit 2015)
Building Progressive Web Apps with Polymer (Chrome Dev Summit 2015)
Chrome for Developers
36 Introduction to RAIL (Chrome Dev Summit 2015)
Introduction to RAIL (Chrome Dev Summit 2015)
Chrome for Developers
37 DevTools in 2015: Authoring to the max (Chrome Dev Summit 2015)
DevTools in 2015: Authoring to the max (Chrome Dev Summit 2015)
Chrome for Developers
38 RAIL in the real world (Chrome Dev Summit 2015)
RAIL in the real world (Chrome Dev Summit 2015)
Chrome for Developers
39 #ChromeDevSummit talks are up - W00T! -- Polycast #34
#ChromeDevSummit talks are up - W00T! -- Polycast #34
Chrome for Developers
40 V8 Performance from the Driver's Seat (Chrome Dev Summit 2015)
V8 Performance from the Driver's Seat (Chrome Dev Summit 2015)
Chrome for Developers
41 Quantify and improve real-world RAIL (Chrome Dev Summit 2015)
Quantify and improve real-world RAIL (Chrome Dev Summit 2015)
Chrome for Developers
42 Owning your performance: RAIL (Chrome Dev Summit 2015)
Owning your performance: RAIL (Chrome Dev Summit 2015)
Chrome for Developers
43 HTTP/2 101 (Chrome Dev Summit 2015)
HTTP/2 101 (Chrome Dev Summit 2015)
Chrome for Developers
44 Leadership Panel (Chrome Dev Summit 2015)
Leadership Panel (Chrome Dev Summit 2015)
Chrome for Developers
45 Build Processes, Totally Tooling Tips (S2, Ep 5)
Build Processes, Totally Tooling Tips (S2, Ep 5)
Chrome for Developers
46 Accessibility (Chrome Dev Summit 2015)
Accessibility (Chrome Dev Summit 2015)
Chrome for Developers
47 Binding to Arrays -- Polycasts #35
Binding to Arrays -- Polycasts #35
Chrome for Developers
48 HTTP2 - HTTP203
HTTP2 - HTTP203
Chrome for Developers
49 Chrome 47: Splash Screens, requestIdleCallback and better desktop notifications (New in Chrome)
Chrome 47: Splash Screens, requestIdleCallback and better desktop notifications (New in Chrome)
Chrome for Developers
50 Call For Submissions - Supercharged
Call For Submissions - Supercharged
Chrome for Developers
51 Cross Device Testing, Totally Tooling Tips (S2 Ep6)
Cross Device Testing, Totally Tooling Tips (S2 Ep6)
Chrome for Developers
52 Testing AJAX with Web Component Tester -- Polycasts #37
Testing AJAX with Web Component Tester -- Polycasts #37
Chrome for Developers
53 Slack: Extended Xmas Special - Supercharged
Slack: Extended Xmas Special - Supercharged
Chrome for Developers
54 Browser testing with Travis & Sauce Labs -- Polycasts #38
Browser testing with Travis & Sauce Labs -- Polycasts #38
Chrome for Developers
55 Optimize for production with Vulcanize -- Polycasts #39
Optimize for production with Vulcanize -- Polycasts #39
Chrome for Developers
56 Highlights from Chrome Dev Summit 2015
Highlights from Chrome Dev Summit 2015
Chrome for Developers
57 Chrome 48: Custom buttons in notifications, DevTools Security panel, and Presentation mode
Chrome 48: Custom buttons in notifications, DevTools Security panel, and Presentation mode
Chrome for Developers
58 Crisper: Protecting your Polymer app with CSP -- Polycasts #40
Crisper: Protecting your Polymer app with CSP -- Polycasts #40
Chrome for Developers
59 How do I use Sass with Polymer? #AskPolymer -- Polycasts #41
How do I use Sass with Polymer? #AskPolymer -- Polycasts #41
Chrome for Developers
60 Colors – DevTools Tonight #0 (Pilot)
Colors – DevTools Tonight #0 (Pilot)
Chrome for Developers

Related Reads

Up next
WhatsApp adds AI agent for businesses in India, it is free for everyone and works 24/7
Vskills Certification
Watch →