Daniel
Sofinet

A passion for visual crafting & user interaction

Product Design Lead at Chemistry Agency

Former Design Lead at Doers

Former Design Lead at Stample

01. transdev 02. Parachut 03. Crédit Agricole 04. LittlePin 05. Club Moving 06. celio 07. Stample

01. who I am

I am a Digital Product Designer. As a well-rounded interaction designer, I make sure that systems, interfaces, language and graphics are friendly, emotive, aesthetically pleasing, clear, on-brand and usable - with a touch of mellow smoothness.

02. what I do

I'm primarily a Visual Designer with extensive education in user experience & interaction design. This means that my design is in the details. I believe that design must support functionality, and vice versa.

Bringing technology closer to you is important in today's hi-tech society. Making the human interaction with digital artefacts more natural and easier to use.

  • Design

  • creative & art direction
  • visual strategy
  • mobile & web apps
  • branding
  • user animations
  • advertising
  • visual guidelines
  • CRM's
  • Interaction Design

  • user experience
  • flowcharts
  • customer journey
  • experience architecture
  • user interactions
  • use(r) cases
  • prototyping
  • Integration

  • html / 5
  • css / less
  • javascript
  • follow up

03. education

Program description:

"We educate designers who can articulate and develop cutting-edge practices in key areas of interaction design: tangible and sensor-based interaction, wearable and embodied interaction, game design, participatory design practices, critical design, social innovation and collaborative media development. Students approach these genres within a broad context that considers the social, political and ethical consequences of their designs. Our education is studio-based, bringing students into close contact with our design professors."

All education done in Sweden, Malmö Högskola.

04. skills

Day-to-day tools that are most frequently used by similar profiles, and most common in today's toolbox for designers.

  • Illustrator
  • Sketch
  • Photoshop
  • After Effects
  • Principle
  • Invision
  • HTML/HAML
  • CSS/SCSS/LESS

05. experiences

let's work together

daniel@sofinet.se

Dribbble

    let's work together

    daniel@sofinet.se

    Note To Self

    The worst enemy to creativity is self-doubt

    Sylvia Plath

    Styles come and go. Good design is a language, not a style

    Massimo Vignelli

    The secret to creativity is knowing how to hide your sources

    Albert Einstein

    Thinking about design is hard, but not thinking about it can be disastrous

    ralph caplan

    Perfection is no small thing, but it is made up of small things

    Michelangelo

    When you ask creative people how they did something, they feel a little guilty because they didn't really do it, they just saw something

    Steve Jobs

    Design can be art. Design can be aesthetics. Design is so simple that is why it’s so complicated

    paul rand

    If a cluttered desk is the sign of a cluttered mind, what is the significance of a clean desk?

    procrastinating...

    Why do they call it rush hour when nothing moves?

    very very intoxicated friend one early morning

    Buy the ticket, take the ride

    hunter s. thompson

    I love deadlines. I like the whooshing sound they make as they fly by

    some t-shirt somewhere

    Ever tried. Ever failed. No matter. Try Again. Fail again. Fail better

    samuel beckett

    be obscure clearly

    a sign in a bar in paris

    Knowing is not enough; we must apply. Willing is not enough; we must do

    von goethe

    Accept the challenges so that you can feel the exhilaration of victory

    I dont know where i first heard this, but it's always there on my mind when work gets heavy

    Quality is not an act, it is a habit

    Aristotle?

    I need to redesign it

    basically every reaction when I see something great

    Make it more black

    - the client said. tried to explain that #000 is the absolute blackest of all black

    Leave it better than you found it

    RobertBaden-Powell

    Get with the Times, New Roman

    garyndesign

    let's work together

    daniel@sofinet.se

    06. celio

    My role as Lead Designer in this mission was fun and exciting. Leading a small team of designers and developers was challenging whilst meeting a tight deadline. The goal was to transform Celio's homepage and welcome it into a more user friendly e-commerce site. It was important to respect the design principles & Celio language, and at the same time be brave & bold. A satisfying & fun challenge to say the least. Check it out.

    #Art-Direction #Design #Team-Managment

    celio hero

    Problem

    The problem we sought out to solve was to identify the intended target's behaviour, analyse it and come back with a better way for them to shop. The results from the analysis was, in short, that the site was hard to use, not inspiring and foremost not coherent. See solution further down.

    Key challenges:
    - Rethink the Celio brand experience.
    - Seamless integration between all devices.
    - Customer experience before, during and after visiting celio.com

    celio 1
    2
    celio 3
    4
    celio 5
    celio 6

    They also took the opportunity & asked us to revise their CRM. We redesigned a few of their trigger, special, promotion, news letter & customer e-mails. We also did some proposals for their PLV's.

    celio 7
    celio 8

    Solution

    So our solution was to re-brand part of their image and focus on the landing. Since the shopping part was the least problematic, we focused mostly on the landing; navigation, search, story-telling. Our approach was to inspire people to stay longer and create a desire to find out more and in the end - feel good enough to start browsing.

    Results:
    - Review and redesign of the artisic direction.
    - Study showed increase use of handheld devices.
    - 15% increase of completed sales, online.

    celio 9
    celio 10

    "We've challenged Doers on the recast of the celio.com’s website in 2016. Beyond the graphical aspect of the interfaces and the navigation, it’s really on innovations and latest UX trends that Doers made the difference with its competitors to deliver a website whose progression in terms of turnover was immediate"

    David Lecomte, CMO Celio

    let's work together

    daniel@sofinet.se

    05. Club Moving

    Club Moving is one of the biggest fitness gym in both France & Romania. My role as Art Director kind of shifted to be hands on on the design. This further on lead to a tight collaboration with the dev team, since the backoffice was an enormous head ache with UX solving. A great challenge concerning both from our & the clients side. Tremendous fun & nothing but positive feedback!

    The goal was to bring in Club Moving (and all of their hundreds of franchise) into a smarter way of working out. Further, how to engage sharing and increase the numbers of people signing up to the clubs.

    See the V1 app on AppStore.

    I also designed & coded the site for the app. Take a look!

    #Lead-Design #Art-Director #Product-Manager

    clubmoving hero

    Problem

    The problem Club Moving faced was that people more and more take on fitness on their own, meaning that they move the whole workout outside the gyms - at homes or outdoors. This leads to less people see the values of being member of a gym and lose reasons to frequent one. It is also becoming threatened by former partners such as NIKE +, who have been running mobile applications for more than three years now.

    Key challenges:
    - Identify and present the values of the application.
    - Simple to use while doing sport.
    - Easily book collective courses.
    - Intelligent coaching and syncronising with machines.
    - Social integration to connect members with eachother.

    I worked closely with a UX designer (Hélène Guibert). Although she had to leave for another mission half way, which left me to finalize & to take care of all the details. Further on I got to take care of all the iterations of the UX. It was a bit difficult to start with since it took some time to get into someone else's mindset. But after a day or two it felt good & I was quite comfortable to take over. A good challenge nontheless.

    UX Screens

    Snapshot of the full UX

    UX Screens
    clubmoving 2
    clubmoving 3

    Solution

    The solution came in the form of an app. This app allows you to be closer to the gym and it's staff, coaches and the community around it. Raising the value of being a member of a community and the events around it kept people more interested and curious. Further, the variety of programs allows people to more easily get the most of what a gym can offer, and most important of all - help each other out.

    Take aways:
    - People don't always want an application. We had to rethink some of the cases to see how the application could behave both as an assistant and as a personal tracker; active vs passive usage.
    - How to actually teach the client what it means to have an application.
    - The importance of feeling of progression. In fact, if users didn't feel as if they progressed within the application itself - they became less pro to continuous usage.
    - It's easy to create a social space. It's much harder to define what it's actually for without users abusing it.

    2
    3
    4
    5
    clubmoving 1

    Video below demonstrates main parts of the app, V1.

    App website

    let's work together

    daniel@sofinet.se

    01. Transdev

    We're currently working with re-polishing Transdev's two products: Eurolines & Isilines. Since the high-season is due pretty soon, our first mission with them is to kind of fix up the graphical chart & some small UX parts. For both, we hotted up their website and improved the UX and graphical charts. I worked closely with two UX-designers- Maxime Castelli & Samson Blond.

    Further on, we designed Isilines travel app that has 10 000+ downloads on app store & google play. See it live!

    #Design #Branding #UI #Guidelines #IxD

    transdev hero

    Problem

    Their graphical chart was slightly messy, which leads to our problem. Our first mission was to establish a consistency & some guidelines based on their current form language. We also identified "pain points" that the users found troublesome. Once we broke down all the cases, we worked on improving the UX. We further extended the solutions and transformed them into an extension of the site(s). This in the form of an app.

    Key challenges:
    - Being able to equip the company with a premium, creative and connected service in a highly competitive market.
    - A fully redesigned, responsive, user-oriented booking site developed with the best open source technologies.
    - Establishment of a marketplace to benefit from advantages on hotels and excursions.
    - A program that deals with branding issues while focusing on CRM, social, e-commerece, upselling and customer experience.

    Isilines

    The process: UX breakdown; identifying the bottlenecks and problems. Redesigning a user journey and test it (with iterations). Wireframing and testing. UI Design. Final tests.

    Isilines header img
    transdev 1
    transdev 2
    transdev 3
    transdev 4
    transdev 5
    transdev 6
    transdev 7

    Prototype of the application showing one of the customer journeys

    Eurolines

    The process: UX breakdown of site. Apply "quickwins" (since our first mission was to do small improvements on their site). Brand identity breakdown. Rework their brand. Apply to website together with the quickwins.

    eurolines hero
    transdev 8

    The brand framework with full UI kit

    The prototype of how to search and book a ticket. See video below for full animation

    Solution

    Our main focus for this was to allow the UI to breathe more. So the solution boiled down to creating more modern graphical language together with clear spacings. For the UX part we did everything from larger focus groups to detailed, individual tests. Once we had identified the problems, we made mockups of the new sites and small tests on selected users. After a few rounds of iterations, we continued our design sprint and came up with a solid UX for searching and buying tickets.

    Impact:
    - More than 80% increase of unique users.
    - 100% mobility and seamless transitions between platforms.
    - Unified and user-centric design.

    let's work together

    daniel@sofinet.se

    07. stample

    One long, tough, bloody start-up year as a lead designer at Stample. This included many different hats such as user experience and interface - designer, almost all integration, team managment & product managment. Learning React, LESS and Github rules was a great challenge in the beginning. The biggest challenge working here was also to handle and create desirable interaction design with such a complex product. So far the biggest and absolutely most complex challenges I've met. In other words - FUN! Have a look.

    #Lead-Design #Product-Manager #Start-up #UX #UI

    PS. A lot has changed since I left.

    stample hero
    stample 1
    stample 2
    stample 3
    stample 4
    stample 5
    stample 6

    "Working closely with Daniel in shaping both our brand and product we came to appreciate his talent, thoughtfulness and dedication. His knowledge and taste is inspiring, and we're very happy with the transformation he achieved."

    Thibaut Gimenez, VP of Sales, Stample

    let's work together

    daniel@sofinet.se

    04. LittlePin

    This is a personal project I've been working on for a couple of months. It aint really done yet, but a basic version is out on AppStore today!
    It's all about saving hotspots around town into your personal map. Drop a pin, describe it, tag it and frame it! Make sure you take a look!

    #Design #WIP #Personal #UX #UI #Application #Interaction-design

    Littlepin hero

    A thorough UX flowchart of version 1.5.

    The screens seen above are the result of a redesign that's currently happening.

    The onboarding

    A promo-video in progress

    One of the promo-videos

    let's work together

    daniel@sofinet.se

    02. parachut

    We were contacted by Advise Care who is a seller of insurance of multimedia objects (mobiles, cameras, tablets etc.) on a B2B platform. Although they wanted to branch out and enter the B2C market with a new product and identity. Our goal was to allow people to insure quickly, simply their personal multimedia objects. Through discussions we understood Advise Care didn't want their future customers to be confronted with small text clauses but to convey transparency. It's currently in the process of being built.
    My role on this project was design lead. To have an overview of the UX side and hands on design & interaction design. The UX designers are Maxime Castelli and Samson Blond.

    #Lead-Design #Product-Manager #Team-Leader #Branding
    #Presentation

    vbca hero

    Problem

    Advise Cares problem was they knew the B2C market was growing and they didn't want to miss their opportunity. They needed to grab potential customers attention with an exciting new brand and identity, so the customer could discover Advice Care’s new innovative tech insurance product. Through discussions we understood Advise Care didn't want their future customers to be confronted with small text clauses to convey transparency.

    Key challenges:
    - Communicate transparency, simplicity and reliability via their new way of being insured.
    - Create an identity and brand.
    - Define the user journey.
    - Create a dialog with potential customers.

    Research

    We felt the first step was to deepen our understanding of personal object insurance, so we decided to do some research in:

    1. What existing personal multimedia insurance companies there were; 2. How were they showcasing their insurance; 3. Understand what platform (desktop or mobile) people felt most comfortable using when looking to buy insurance; 4. What people would like to feel from a brand who deals with insurance; We found that existing companies, through their design, believed that users were reluctant and skeptical to engage fully when it comes to insurance. Because we saw many insurers concentrating on minimising clicks for the user to obtain an insurance quote. Thus the user would get a clearer idea what they get for their money, because it was based on the quotes information not on a preconceived idea.

    parachut 1

    User-flow of the website together with actions

    Keeping in line with our user centred approach to all projects we start off with a brainstorm session about what is needed to make a decision. We found ourselves coming back to the question ‘do users want all the information at once, or prefer to be able to see what information they need to make a purchase?’

    We collated the information from the brainstorm and started to piece together the archetypes and then specified our personas. Starting with identifying their pain points by categorising the user objectives and Parachut’s previous market research. We used the moscow (Must/Should/Could/Won’t) method to decide what components are fundamental for the site.

    persona

    Our main persona, Julie

    We agreed that prioritising one persona (Julie) was the best way forward because with no prioritisation of personas we would only complicate the process and not create a coherent product. So Julie was chosen, her pain point ‘being confused about insurance and not able to trust an insurance to pay when making a claim’. We believed if we could help her then everyone will be better off.

    Sketching

    We sketched the desktop and mobile website with the UI and marketing teams; because we knew how the site was going to be used, who was going to use it, what content was needed to be seen and when and how it was going to be digested.

    sketch

    From sketching, to prototyping, to final design

    Prototyping

    Lastly, we created a prototype with invision because we wanted to user test the design and for Advise Care to understand their new potential product. We created a test group which closely resembled the personas we created. We found that most people felt comfortable to create a quote based on the content they saw; which ticked one of our key goals of creating a dialog with the customer; we believed this would lead them to becoming a retention level user. Which would give us the opportunity to remind them on the progress of their insurance with notifications. We also gained another insight; in order for people to have a trusting mindset towards the insurance, people needed to be able to learn more about the company itself – not just the offer details. We decided to highlight the company's previous awards and their partnerships. On further tests this issue was no longer brought up.

    Video showing complete animation of the Landing page

    Video showing complete Quote Maker

    Video showing complete Discover page

    Branding

    The focus here relied heavy on colors of the year (2017), vibrant and bold. It was important to stand out as much as possible and to have a "younger" brand language. Also to incorporate the notion of having fun and being active.

    branding 1

    The complete branding guidelines

    Solution

    We knew that with insurance it was going to be a hard task to engage users. Although with our process of putting the user at the centre of the project and concentrating on what they needed and wanted, helped engagement levels to rise. For us we learnt applying a stepped approach we could then tweak at every step with Advise Care’s input. Our next challenge will be to continue testing our process and perfecting it for our next customer.

    Key take aways:
    - User centric wording in the menu increased the interactions by 46% (words such as we as opposed to us).
    - By showcasing testimonials, users felt more at ease to continue browsing the rest of the site and find out more.
    - We found users prefer to read information on mobile and then continue their purchasing on desktop.
    - Having small sections of text helps the user to stay retentive for longer.

    let's work together

    daniel@sofinet.se

    03. Le Village by Crédit Agricole

    Crédit Agricole is one of the biggest banks in France. They have developped a rich and vast network of incubators for start-ups, all around the country. In June, they launched a brief for the redesign of this website that holds and showcases each and every Village (as they're called). The following design is given to, and accepted by, Crédit Agricole – and is currently under development.

    The idea was to propose a design and a navigation that highlights the dynamism as well as the effervescence of the life of the villages. To bring the user back into this adventure by inviting them to choose the a story (start-up, partner or neutral) from which they wish to discover the Village by Ca on their arrival. This made the dominant colorimetric change as well as content to enable more targeted story-telling. The content, as well as the interactions of start-ups and partners gives the life to the site, which is why the design is clean and predominantly white.

    With me on this mission was Valentine Avondo Bedone.

    #Design #Product-Manager #Branding #Art Direction #Interaction Design

    vbca hero

    Problem

    The Village by CA has around 30 incubators all around France and the issue was to allow the user to easily find out about the individual "Villages". Also to showcase each village and its start-ups, partners and staff. It was a tough challenge to separate each scenarios and identify the pain points to clearly design each solution.

    Key challenges:
    - Guide the users to discover the all the villages.
    - Unify the different stories.
    - Make sure that the user easily understands what each village does and get a consice insight.
    - Find an appropriate design that makes a fairly complex product, feel unified.

    vbca 1

    Snap shot of how the white dominant color plays with the color of a category (in this case start-up; red & black for neutral.

    vbca 2

    Color category for partners

    vbca 3

    Events and social life of a Village

    vbca 4

    An example of the quick and dirty wireframes

    vbca 5

    One of the site maps

    The header- how the user gets to choose what story to follow.

    General interactions of the landing page

    Solution

    The brief was packed with complex requirements and rules, so the solution was to create a story for each rule and then lay each story together as a giant puzzle. Thus getting a macro overview and easier design with the client to achieve the goals. We created three main stories, making them similar to each other, but not too similar so that it doesn't feel repetitive.

    Take aways:
    - Not to use political colors (blue, red etc).
    - Test smaller interactons with real users, as opposed to close to finished prototypes.
    - Users respond positive and understood quickly that the site was devided.
    - Never assume that users wants to be guided at every step.

    let's work together

    daniel@sofinet.se