WiredcraftWiredcraft is a team of expert designers, engineers and strategists building Web and mobile products.https://wiredcraft.com/
2017-08-18T01:39:52+00:002017-08-18T01:39:52+00:00Jekyll v3.5.2Designing offline to online digital experiences<p><img src="http://wiredcraft.com/images/posts/etam-preview.jpg" alt="E&amp;JOY digital tables" /></p>
<p>We’re known mostly for our work with software, whether it’s with machine learning, mobile and WeChat apps or DevOps and micro-services. We have however been increasingly investing into hardware products in the past year.</p>
<p>The way we partner with our clients demand that we run projects like startups of their own; we bring our expertise creating and growing digital products in fast iterations with a strong emphasis on the user.</p>
<p>We’ve worked in challenging environments before, while creating the software for the elections of Myanmar for example. But we’ve found that when hardware is involved, things can get an order of magnitude more complicated.</p>
<h2 id="digital-ecosystem-for-a-new-flagship-store">Digital ecosystem for a new flagship store</h2>
<p>Etam approached us end of last year to help them design the digital experience of one of their new flagship store, E&amp;JOY, in Shanghai.</p>
<p>The goal was to create a new retail experience with offline to online elements to engage customers and a digital to managing the store and products.</p>
<p>The result of over 6 months of work included a series of digital tables allowing customers to explore and select outfits mapped to the store, a catwalk booth aloowing them to share a video of them wearing the outfit through a WeChat app, and stock/furniture management through a visual merchandising app that worked in concert with bar-code scanners.</p>
<iframe width="100%" height="405" src="https://www.youtube.com/embed/fiT8mcLOrjU" frameborder="0" allowfullscreen=""></iframe>
<h2 id="what-we-learned">What we learned</h2>
<p>Being one of our first serious hardware projects, we thought we’d share a few lessons we learned on the way.</p>
<h3 id="lesson-1-constraints-are-very-different">Lesson 1: Constraints are very different</h3>
<p><img src="/images/posts/etam-constraints.jpg" alt="Constraints" /></p>
<p>When you only deal with software, your constraints are fairly well defined; you need to support a collection of screen sizes. Not always trivial, but not too challenging either.</p>
<p>With hardware, you very quickly learn that there are a lot more factors to take into account. The environment itself limits you (e.g. the max size of the table, the lighting) but users may also surprise in how they interact with the experience you designed.</p>
<h3 id="lesson-2-you-get-genuine-user-feedback">Lesson #2: You get “genuine” user feedback</h3>
<p><img src="/images/posts/etam-genuine-feedback.jpg" alt="Genuine feedback" /></p>
<p>Validating our assumptions with users is <a href="https://wiredcraft.com/blog/how-we-design-products/#validate">at the core of our product design process</a>. When working with physical installations, users communicate their feedback in a much more immediate and concrete way; they touch, move, laugh, swear in a way that isn’t usual on common devices.</p>
<h3 id="lesson-3-users-are-shy-and-less-attentive">Lesson #3: Users are shy and less attentive</h3>
<p><img src="/images/posts/etam-user-feedback.jpg" alt="User feedback" /></p>
<p>For apps, we often run our user testing sessions by screen sharing (using for example Google Hangout).</p>
<p>When you’re dealing with a physical space, users tend to be a little more shy. You’ll need to leave them alone to immerse themselves and interact with your product.</p>
<p>Assume as well that they’ll be a lot less attentive to things like text. They want to touch. Use big fonts, animations, graphics, etc, to draw attention. There are a <a href="https://www.invisionapp.com/blog/large-desktop-experience-responsive-design/">lot of</a> <a href="https://magenta.as/ux-design-for-big-screens-6cfc449c6b94">ressources online</a> about this.</p>
<h3 id="lesson-4-youll-need-a-lab">Lesson #4: You’ll need a lab</h3>
<p><img src="/images/posts/etam-lab.jpg" alt="User feedback" /></p>
<p>We didn’t have one. We had to take over a part of our office and convert it into a workshop and prototyping area: expect to nail, saw, drill, glue and overall build large things.</p>
<p>Also, a first aid kit isn’t a bad idea.</p>
<h3 id="lesson-5-you-will-get-a-lot-more-feedback">Lesson #5: You will get a lot more feedback</h3>
<p><img src="/images/posts/etam-more-feedback.jpg" alt="User feedback" /></p>
<p>When you deal with physical installations, there are a lot more possibilities for users to interact.</p>
<p>Moreover, they are a lot more likely to have an opinion about it. It’s pretty simple; not everybody has an opinon about the design of an app, but anybody immediately knows how they feel interacting with a physical product.</p>
<p>Overall, be prepared to get a lot more feedback and ideas from users.</p>
<h3 id="lesson-6-things-take-a-lot-longer-with-hardware">Lesson #6: Things take a lot longer with hardware</h3>
<p><img src="/images/posts/etam-longer.jpg" alt="User feedback" /></p>
<p>The parts you think will be hard will be easy, and the other way around. That is sometimes true for software, and is much more for hardware. On the E&amp;JOY project, simply gluing wires for one of the installation ended up taking 3 tries and over 9 hours.</p>
<p>Despite your planning, physical realities bring up unforseeable constraints (e.g. catwalk camera went through the roof)</p>
<h3 id="lesson-7-prototype-a-lot">Lesson #7: Prototype… a lot!</h3>
<p><img src="/images/posts/etam-prototype.jpg" alt="User feedback" /></p>
<p>To be able to test things, you’ll need a full blown prototype. There are a lot of things you only realize once you’re physically interacting with them.</p>
<p>We created multiple prototypes for E&amp;JOY, and even then we ended up with a ton of details to adjust on site.</p>
<p>We could have avoided a lot of this had we built prototypes closer to the final stage.</p>
<h3 id="a-few-more-things">A few more things</h3>
<ul>
<li><strong>Coordinate with construction</strong>; document all changes and over-communicate with the construction crew to make sure they don’t undo your work and label everything (our wiring was wiped out more than once).</li>
<li><strong>Measure 5 times, cut once… and do it all over again</strong>; approximation aren’t as forgiving in the physical world. You’ll end up being pretty sorry for a few milimeters sometimes. Again, prototyping here is your best shot, and remember to have backup parts once you do the final installation.</li>
<li><strong>Delay as much as possible</strong>; things like cabling for example; the later you do it, the better.</li>
<li><strong>Always bring all your tools</strong>; you never know what you’ll need to alter. Make sure you have spare parts too.</li>
<li><strong>Plan for more time</strong>; everything will take much longer than you’d like, especially the closer you get to the final product.</li>
<li><strong>You can’t iterate that much</strong>; you simply can’t fail that many times, there’s a very real price attached to any new part. You’ll quickly realize you also can’t diverge too much from the original idea either.</li>
</ul>
<p><strong>We’re already working on a few other hardware projects; <a href="mailto:business@wiredcraft.com">if you’d like to talk to us about your idea, drop us a line at business@wiredcraft.com</a></strong>.</p>
2017-08-15T00:00:00+00:00https://wiredcraft.com/blog/designing-offline-to-online-digital-experiences/
https://wiredcraft.com/blog/designing-offline-to-online-digital-experiences/G'day Lennon<p><img src="http://wiredcraft.com/images/posts/lennon-blog-picture.JPG" alt="G'day, Lennon, our new designer." /></p>
<p>Lennon is a fresh design intern joining the Wiredcraft team. He recently returned from Australia to look for a challenge in his hometown of Shanghai.</p>
<p>With a degree in Software Design from the University of Queensland, Lennon has a wide variety of interests ranging from business analysis, UI/UX design, to front-end development. With two years of design experience at his previous company, Lennon is very interested in experiencing the differences between working in two very different cities and cultural backgrounds.</p>
<p>In his spare time, you’ll find Lennon running 7K every morning, working on fun web-related side projects, updating his Instagram or doodling random illustrations.</p>
2017-08-14T00:00:00+00:00https://wiredcraft.com/blog/lennon-blog/
https://wiredcraft.com/blog/lennon-blog/Szia, Zihui<div style="text-align:center"><img src="http://wiredcraft.com/images/posts/zihui-blog-picture.jpg" alt="Szia, Zihui, our new member of the Marketing team in Shanghai" /></div>
<p>Zihui has recently joined the Wiredcraft marketing team in Shanghai. She learned about the team through the website, and wanted to join so she could work on “apps that matter”.</p>
<p>She graduated with a degree in Social Work. While working in the digital marketing field, she developed an interest in website development. Now in her spare time she teaches herself to code using online resources.</p>
<p>She has a great passion for musicals (and according to her, it’s a very different thing from opera :P), and has spent several past vacations traveling to Europe to see performances. Her most recent and perhaps all-time favorite show is Tanz der Vampire (Dance of the Vampires), performed in German. She hopes she’ll have the chance to see it again in Vienna before the season ends next year.</p>
2017-08-09T00:00:00+00:00https://wiredcraft.com/blog/zihui-blog/
https://wiredcraft.com/blog/zihui-blog/Hey there, Ann<p><img src="http://wiredcraft.com/images/posts/ann-blog-pic.jpg" alt="Hey there, Ann, our new member of the Operations Team in Shanghai" /></p>
<p>Ann joins the Wiredcraft team in Shanghai as an Operations Trainee. She is currently a sophomore at the Shanghai University of International Business and Economics and is excited to start her first job with us.</p>
<p>Ann loves learning. She believes that you can never stop acquiring skills and gaining precious experience through both school and work.</p>
<p>During her holidays, she loves traveling and has been to many places in China, including Guilin, Zhangjiajie and Qinhuangdao. She also loves doing sports and has been recently keeping fit through dance. She plans to see the Olympic Games in 2024 with her father, paying her own way with money she’s earned herself.</p>
2017-07-26T00:00:00+00:00https://wiredcraft.com/blog/ann-blog/
https://wiredcraft.com/blog/ann-blog/Hiya Mary<p><img src="http://wiredcraft.com/images/posts/mary-blog-pic.jpg" alt="Hiya, Mary, our new member of the Front-end team in Shanghai" /></p>
<p>Mary joins the Wiredcraft team in Shanghai as a front-end developer. As a programmer, she is passionate about new technology and coding, and looks forward to working with everyone and growing at the same time.</p>
<p>She has recently graduated from Qingdao Technological University with a degree in Information and Computer Science. During her time at school, she loved exploring and traveling very much, having travelled to Yantai, Xi’an and Hangzhou. She enjoys going to different places and meeting new people.</p>
<p>Mary doesn’t limit herself to just girly activities. In college, she learnt the art of nunchakus and met many interesting people through that. Mary loves mystery novels and suspense films and her favorite author is Keigo Higashino. Currently she is learning to play the harmonica, as she wishes to become more artistic.</p>
2017-07-25T00:00:00+00:00https://wiredcraft.com/blog/mary-blog/
https://wiredcraft.com/blog/mary-blog/How are you Yiwan<p><img src="http://wiredcraft.com/images/posts/yiwan-blog-pic.jpg" alt="How are you, Yiwan, our new member of the Front-end team in Shanghai" /></p>
<p>Yiwan joins the Wiredcraft team in Shanghai as a front-end developer. Before coming to Shanghai, he lived in Wenzhou for a long time (very typical for a Wenzhounese!)</p>
<p>He has written a lot of JavaScript code, and has a love-hate relationship with this weird programming language. Now he has become a fan of Go, and dabbles in some Lisp in his spare time.</p>
<p>He’s recently gotten into more outdoor activities, wanting to spend his free time doing things other than reading manga and playing video games. Recently, he’s discovered Bushcraft - the skills needed to survive in the wild, and is very interested in trying it for himself one day.</p>
2017-07-20T00:00:00+00:00https://wiredcraft.com/blog/yiwan-blog/
https://wiredcraft.com/blog/yiwan-blog/Nong hao Jason<p><img src="http://wiredcraft.com/images/posts/jason-blog.jpg" alt="Nong hao, Jason, our new member of the Front-end team in Shanghai" /></p>
<p>Jason joins the Wiredcraft team in Shanghai as a front-end developer. He will work with the team in tackling all the front-end work for our clients.</p>
<p>Jason received his Bachelor’s and Master’s Degree in Mechanical Engineering from Beijing University of Chemical Technology. After graduation, he worked in the Fujian Petrochemical Industry Design Institute as a Mechanical Engineer, before moving to Shenzhen to work as a front-end developer.</p>
<p>In his spare time, he likes reading novels and jogging. His top 3 reads so far this year are “When Breath Becomes Air”, “And Then There Were None” and “The End of the Affair”.</p>
2017-07-06T00:00:00+00:00https://wiredcraft.com/blog/jason-blog/
https://wiredcraft.com/blog/jason-blog/Nihao Tracy<p><img src="http://wiredcraft.com/images/posts/tracy-blog.jpg" alt="Nihao, Tracy, our new member of the operations team in Shanghai" /></p>
<p>Tracy joins the Wiredcraft team in Shanghai as an Operations Assistant. She will support the team by making sure things run smoothly.</p>
<p>She came to work in Shanghai after studying in Hangzhou. Although she majored in Finance, her real passion was organizing and participating in student-run events in college. Her previous role before joining Wiredcraft was in Event Marketing &amp; Operations.</p>
<p>She has many hobbies and loves learning! In her free time, she likes to dance, read, travel, and participate in color runs. She really enjoys live music, art exhibitions, and of course, eating.</p>
2017-07-04T00:00:00+00:00https://wiredcraft.com/blog/tracy-blog/
https://wiredcraft.com/blog/tracy-blog/Hallo Stelios<p><img src="http://wiredcraft.com/images/posts/stelios-blog.png" alt="Hallo, Stelios, our new member of the backend team in Berlin" /></p>
<p>Stelios joined the Wiredcraft team in Berlin as a Backend Engineer. He got his Bachelors in Computer Science from Brown University. After college he moved to Seattle to work at Microsoft as a Program Manager in the Windows team, before spending some time in Dubai to help some friends set up a startup.</p>
<p>He loves coding in node.js and delving deep into the nuts and bolts of tools and frameworks. In his free time he enjoys reading both fiction and non-fiction, watching movies, and playing tennis.</p>
2017-06-14T00:00:00+00:00https://wiredcraft.com/blog/hallo-stelios/
https://wiredcraft.com/blog/hallo-stelios/Hey Oliver<p><img src="http://wiredcraft.com/images/posts/oliver-blog.JPG" alt="Hey, Oliver, our new member of the backend team" /></p>
<p>Oliver has joined the Wiredcraft team as a Backend Developer in our Shanghai office. He received a Masters Degree in Software Engineering at the University of York in the UK. At university, he learned Requirement Engineering and User Centered Design, and contributed to Modle-Driven Development Langage(Epsilon) IDE(EuGENia). He has been working in Shanghai for 3 years as a Backend/Fullstack Developer. He loves Node.js, React and Docker, has a passion for trying and learning new tech and gets the job done in a quick and elegant way.</p>
<p>After work, he likes to read technical books, play console games and go hiking/bicycling. He is currently making himself dive into Micro-services and Python, and his favorite book is “Hackers and Painters”. Tomb Raider, Fable and Saints Row are his favorites video games series. A dedicated cycler, he has recently been riding 130km at Qiandao Lake in Hangzhou, China.</p>
2017-05-25T00:00:00+00:00https://wiredcraft.com/blog/hey_oliver/
https://wiredcraft.com/blog/hey_oliver/