ENOR Technologies

CUSTOM WEBSITE DESIGN

A look that makesyour brand stand out.

We design your website around your identity, content and audience. From the page structure to the interface details, we create a clear and consistent visual experience.

Discuss your designSee the process
Atelier LineaIllustrative concept
  • Structure
  • UX/UI
  • Interactive prototype

IDENTITY ON THE WEB

Your website should look and feel like your brand.

Colours and a logo are only part of an identity. How content is organised, how typography is used and how photos are presented also shape how the business is perceived.

At ENOR, we design these elements together. We create a visual direction that supports your message and helps visitors understand the offer, find their way and take the next step.

Included in this service

  • Creative direction
  • Information structure
  • User experience
  • Interface design
  • Wireframes
  • Responsive design
  • Interactive prototypes
  • Visual components
  • Material for implementation

Not included in this service

  • Frontend or backend programming
  • Building a CMS
  • Payment or API integrations
  • Website launch
  • Hosting
  • Technical maintenance

These can be offered as a separate development project.

This service covers design. Programming, CMS, integrations and launch are development work and are offered separately.

WHAT THE SERVICE INCLUDES

From creative direction to detailed screens.

Six parts that build on each other.

  1. 01

    Identity and audience analysis

    We understand the brand, the content and the users.

  2. 02

    Structure and navigation

    We organise the pages and the flow of information.

  3. 03

    Wireframes

    We set the hierarchy before the visual treatment.

  4. 04

    UI design

    We design the screens, components and states.

  5. 05

    Responsive screens

    We adapt the design to the agreed screen sizes.

  6. 06

    Prototype and handoff

    We connect the key interactions and prepare material for implementation.

CREATIVE DIRECTION

A visual language with a purpose.

We define a direction that fits the business’s positioning and can be kept consistent across the whole website.

  • Moodboard
  • References
  • Typography
  • Colour palette
  • Photo style
  • Icons
  • Spacing
  • Component treatment
Moodboard · Atelier LineaIllustrative concept

Typography

Aa

Typography · Heading 40/48 · Body 16/26

Palette

SandForestOliveWalnut

Icons

Spacing

CalmWarmOrderlyPhoto style: Natural light, warm tones

We use references to discuss the direction, not to copy compositions or material.

A new logo and a brand book are separate services unless they are included in the proposal.

STRUCTURE & UX

Before the look, we define what needs to be understood.

The sitemap and wireframes show what each page contains, in what order and why, before we choose colours or photos.

  • Page goals
  • Main audiences
  • Sitemap
  • Navigation
  • Information hierarchy
  • Flows
  • CTA placement
  • Form organisation

User interviews, usability tests and extended research are included only when they are part of the project; an internal discussion is not user research.

Sitemap and wireframeIllustrative concept

Pages

Atelier Linea

Notes · Home

  1. 1Hero with the offer and main CTA
  2. 2Three services with links
  3. 3Two selected projects
  4. 4Short contact form

Pick a page in the sitemap to see its wireframe and notes.

INTERFACE DESIGN

Details that create a consistent experience.

We design the pages in scope and define how each component looks in every state.

Illustrative concept
Book a consultation

State

Visual specification · Default: The base look.

Pick a component and a state to see the visual specification.

Pages, per scope

  • Home page
  • Service pages
  • About
  • Contact
  • Listings
  • Detail pages
  • Navigation
  • Footer
  • Forms

States are visual specifications and designed behaviour for the team that will implement them; they are not programmed functionality.

RESPONSIVE DESIGN

The same brand, a composition adapted to every screen.

We design desktop, phone and, when needed, tablet, and explain how each element behaves between screen sizes.

  • Desktop
  • Mobile
  • Tablet when needed
  • Mobile navigation
  • Content order
  • Typography
  • Buttons
  • Forms
  • Galleries
  • Long content

Behaviour between screens

ElementDesktopTabletPhone
NavigationHorizontal menuCompact horizontal menuMenu button
Projects3 columns2 columns1 column
H1 heading40 px34 px28 px
ButtonsInlineInlineFull width
GalleryGridGridHorizontal scroll

The design defines the behaviour; working on devices is confirmed only after implementation and testing.

DesktopTabletPhoneIllustrative concept
atelier-linea.example
Atelier LineaStudioProjectsServicesContact

Spaces that feel like home.

Interior design for homes and offices.

Book a consultation

Services

  • Design
  • Furnishing
  • Lighting

Selected projects

  • Apartment in Tirana · 120 m²

  • Office in Durrës · 260 m²

Atelier LineaStudioProjectsServicesContact

Spaces that feel like home.

Interior design for homes and offices.

Book a consultation

Services

  • Design
  • Furnishing
  • Lighting

Selected projects

  • Apartment in Tirana · 120 m²

  • Office in Durrës · 260 m²

Atelier Linea

Spaces that feel like home.

Interior design for homes and offices.

Book a consultation

Services

  • Design
  • Furnishing
  • Lighting

Selected projects

  • Apartment in Tirana · 120 m²

Open the menu on the phone and compare the behaviour table between screens.

INTERACTIVE PROTOTYPE

See the experience before implementation.

The prototype connects the key screens so you can assess navigation and the flow of use before development starts.

  • Menu
  • Page transitions
  • Tabs
  • Forms
  • Selections
  • Confirmation states

Prototype: simulates interaction, sends no data

Atelier Linea

Spaces that feel like home.

  1. Home
  2. Menu
  3. Services
  4. Contact
  5. Confirmation

Click through the prototype like a website. Turn on the clickable areas to see the links.

The prototype simulates interaction. It does not process payments, does not send data and is not a working website.

Not every micro-interaction is built into the prototype; we agree which flows are connected based on scope.

COMPONENTS & VISUAL GUIDELINES

A foundation to follow during implementation.

We prepare the project’s styles and reusable components so the development team follows the same rules on every page.

  • Type styles
  • Colours
  • Spacing
  • Grid
  • Buttons
  • Form fields
  • Cards
  • Navigation
  • Icons
  • States
  • Reusable components
Illustrative concept
  • Spaces thatH1 · 40 / 48 · 700
  • Spaces thatH2 · 28 / 36 · 600
  • Spaces thatH3 · 20 / 28 · 600
  • Spaces thatBody · 16 / 26 · 400
  • Spaces thatLabel · 12 / 16 · 600

Switch tabs to see the type scale, colours, spacing and grid.

A component library for a project is not a full organisational design system.

The size of the library and the level of documentation are set out in the proposal.

HANDOFF

Design organised for the next step.

As agreed, we deliver the material the team implementing the design will need.

  • Source file in the design tool
  • Approved screens
  • Prototype
  • Components
  • Export-ready assets
  • Notes on responsive behaviour
  • Interaction notes
  • Guidance for the implementation team
Handoff · Atelier LineaIllustrative concept

Source file

  • 01 Visual direction
  • 02 Sitemap and wireframes
  • 03 Desktop screens
  • 04 Mobile screens
  • 05 Components and states
  • 06 Prototype

Export-ready assets

  • SVG icons
  • WebP images
  • Fonts per licence

Note for the implementation team

  • — Spacing follows the 4–64 px scale.
  • — Buttons take full width on phones.
  • — Focus uses a 2 px outline in the accent colour.

Licences for fonts, photos and external material must be clear. Ownership, usage rights and delivered files are set out in the agreement.

Visual review during implementation can be added as a separate service.

HOW WE WORK

From the briefto an approved design.

The number of concepts, screens and review rounds is set out in the proposal.

01

Brief

We understand the business, audience, material and goals.

02

Structure

We define the pages and the content hierarchy.

03

Visual direction

We prepare and discuss the proposed style.

04

Screen design

We design the agreed pages and components.

05

Prototype and review

We assess the flows and include feedback within scope.

06

Handoff

We organise the files and guidance for implementation.

How should your website look?

Discuss the design
Revisions are not unlimited; the rounds and how changes are handled are set out in the proposal.

WHY ENOR

Design with identity and clear logic.

  • Direction based on the brandThe look is built on your positioning, not a template.
  • Structure around contentPages are organised around what visitors need to understand.
  • Attention to mobileThe phone is designed from the start.
  • Consistent componentsThe same rules on every page and in every state.
  • Feedback with approval pointsStructure, direction and screens are approved in turn.
  • Organised handoffFiles, prototype and guidance ready for implementation.

Our portfolio shows only real projects, with ENOR’s role, for example “UX/UI design” or “Website design”.

Hand sketching a website wireframe on paper

FAQ

Frequently asked questions.

Other services

More solutions for your business needs.

How should your website look and feel?

Tell us about your brand, your audience and the pages you want designed. We will define the direction and the design deliverables.

Describe your brand, audience and the pages you want designed.

What our clients say

5.0
A
Arben Hoxha, CEO

Sample Logistics Co.

“They translated complex technical concepts into clear decisions for our team.”