UI/UX planning and implementation

Web design templates and web page layout editing, improving UX/UI, collage and paper cut composition
Picture of Tamas Gurbacs

Tamas Gurbacs

UI/UX planning and implementation

UI/UX planning at Attrecto

With the development of the Internet and mobile applications, the term of User Experience (UX) has become a keyword of product development. In recent years, all people are talking about user experience, it seems that everyone can be a UI/UX designer, as the popularity of design in the world. But what is that? What is called as a good User Experience Design?

What is the user experience?

User experience (UX) refers to a person’s emotions and attitudes about using a particular product, system or service. It includes the practical, experiential, affective, meaningful and valuable aspects of human–computer interaction and product ownership. Additionally, it includes a person’s perceptions of system aspects such as utility, ease of use and efficiency.

Product interaction is just a portion of the customer journey, the bigger picture of the entire customer satisfaction is customer experience, or CX. UX is specifically about the experience a user interacts with your product; CX (Customer Experience) means the relationship between your customer and your organization. UX is part of CX.

  • UI/UX planning and implementation workflow

As a web- and mobile development company with a near-decade experience, we are very much aware of the importance of UI/UX in mobile and web development. The success of a development project is significantly influenced by how well it was prepared, the lack of proper planning may even be the reason of a failure. At Attrecto we discover the business, technical, design and operating requirements to design distinctive, killer-performing apps and solutions that are competitively advantaged in the marketplace.

1.1. Personas and customer journeys

Goals: To see the big picture and define the steps the users will go through. We can design better experience if we think in processes instead of screens.

Deliveries: Use cases for each persona, user journeys with diagrams or lists.

1.2. Sketching

Goals: We can try radically different ideas fast, and can experiment with unusual things. We can design how it works before getting into the detailed design (cost and time efficient).

Deliveries: Ideas for the main flows and how the main functions will work, and ideas for the layout and visual hierarchy.

1.3. Wireframing & usability testing

Goals: We design the layout of the interface elements, the proportions, the copy and the navigation with wireframes. With clickable prototypes we can test the UI with real users early, before putting too much effort into the design.

Deliveries: Wireframes that shows the layout, navigation, microcopy, without detailed design, clickable prototype about the main flows.

1.4. Look & Feel

Goals: To explore different styles based on the target group, and define the character and the atmosphere of the product.

Deliveries: Collection of inspirations to different styles. You will get 2-3 look&feel drafts to a specific screen from the wireframes. This is not the final design; just sketches to show you how will it look and feel.

1.5. Detailed Design

Goals: To design the screens in detail, and design the interactions.


–          Every screen and state are designed.

–          PSD files prepared for developers.

–          Fonts, icons and other assets.

–          Style guide and/or UI kit.

–          Documentation.

We are making a conscious effort to ensure that we deliver high-quality, well tested software products after a careful UI/UX planning. It is one of most cited advantages of working with Attrecto by our clients.

Share this post