$30 off During Our Annual Pro Sale. View Details »

UX, Front-end and Back-end

UX, Front-end and Back-end

How front-end can help UX and Back-end guys? How they interact? I tell a little about it in this slides, showing how the front-end can help the back-end and UX.

Diego Eis

May 11, 2015
Tweet

More Decks by Diego Eis

Other Decks in Technology

Transcript

  1. Diego Eis I love work with web. And I lost

    55 pounds. ;-) @diegoeis @tableless http://tableless.com.br http://diegoeis.com http://slideshare.net/diegoeis
  2. Interactive Design This important guy is a scientist of behavior.

    He understand how will navigate and use all pages of system. They take business needs and product requirements and transform them into user-focused interface and experience.
  3. Interface Designer I like to name this guy simply like

    Designer. He will design the layout and the modules that will bring the interfaces concepts to life, cultivating customers and brands. They know how an beauty interface can sell and retain more costumers.
  4. Back-end They care about the environment and how the functionalities

    will work. All the server side logic of application, API structure and web services, databases integrations and many other processes.
  5. Front-end Very short explain: Front-end is the guy that will

    implement the Layout created by Interface Designer and will study and apply the project specs explained in wireframe designed by Information Architecture.
  6. What about UX? This is a long and boring discuss,

    but here we go: I think the way that UX name is applied is wrong. UX is not a concern of one team or one person. The client support cares about the User Experience. The dev and the Product Owner cares about it too. UX is not an exclusive name to a exclusive type of people in a project. All people involved in a project is an UX.
  7. Let’s be clear All people that works with web are

    responsible for user experience. Not only UX, UI or Front-end. This is also a concern of back-end, product owner, manager and all people involved to the project.
  8. Linear or parallel Sometimes the flow needs to be linear,

    like in small projects like websites. But, with the adoption of web standards this flow can be parallel. This is awesome.
  9. Implement direct in back-end code Instead deliver a static code

    to back-end, the front-end team can implement the html/css/javascript code directly into back-end code.
  10. Consume API If Back-end deliver an API, the Front-end guys

    take care about all interface. Back-end don’t need to write any line of front-end code.
  11. Prototypes Sometimes the tests with user need to be more

    real. Functional prototypes are more useful than squares in white background.
  12. Understand visual patterns Front-end needs to know when the pattern

    of alignments, weight and size of elements are wrong.
  13. Know what good design is Understand a little about design

    and how designers make your layouts.
  14. A Framework helps all If you work in a big

    company that have a big product or many products that share same visual interface, maybe it's a good idea to create a CSS Framework and define a common styleguide.
  15. HTML needs to be common to all If exists one

    thing that back-end, front-end and UX teams needs to learn, this things is HTML. The HTML is influenced by all.
  16. Designing Programming interface photoshop illustrator personas usability accessibility semantic HTML

    CSS ruby javascript json database infrastructure API PHP development environment UX UI layout AI prototype tests python JS for Interface NodeJS EmberJS
  17. In fact, having only one front-end developer in a team

    with other developers doing only server-side work is a recipe for disaster. Don Roby bit.ly/18MX8cg
  18. One of the reasons for poor design execution is that

    UX teams need to own more than just design. We need to own front-end development. UX Matters http://bit.ly/ux-require-frontend