{"id":17488,"date":"2025-04-03T11:57:36","date_gmt":"2025-04-03T09:57:36","guid":{"rendered":"https:\/\/hivecreatives.se\/tjanster\/web-design\/"},"modified":"2025-05-27T12:55:53","modified_gmt":"2025-05-27T10:55:53","slug":"web-design","status":"publish","type":"services","link":"https:\/\/hivecreatives.se\/en\/services\/web-design\/","title":{"rendered":"Web design"},"content":{"rendered":"<style>.elementor-17726 .elementor-element.elementor-element-9dc7cd0{--display:flex;--min-height:500px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--padding-top:200px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-17726 .elementor-element.elementor-element-9dc7cd0:not(.elementor-motion-effects-element-type-background), .elementor-17726 .elementor-element.elementor-element-9dc7cd0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );background-image:url(\"https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/01.jpg\");}.elementor-17726 .elementor-element.elementor-element-e584241 .elementor-heading-title{font-family:\"outfit\", Sans-serif;font-size:18px;font-weight:300;color:var( --e-global-color-1b7c756 );}.elementor-17726 .elementor-element.elementor-element-e584241 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;border-style:none;border-radius:0px 0px 0px 0px;}.elementor-17726 .elementor-element.elementor-element-e584241.elementor-element{--align-self:flex-start;}.elementor-17726 .elementor-element.elementor-element-b33ec3d .elementor-heading-title{font-family:var( --e-global-typography-09506f0-font-family ), Sans-serif;font-size:var( --e-global-typography-09506f0-font-size );font-weight:var( --e-global-typography-09506f0-font-weight );line-height:var( --e-global-typography-09506f0-line-height );letter-spacing:var( --e-global-typography-09506f0-letter-spacing );word-spacing:var( --e-global-typography-09506f0-word-spacing );color:var( --e-global-color-1b7c756 );}.elementor-17726 .elementor-element.elementor-element-3e8986d{font-family:var( --e-global-typography-df58ad6-font-family ), Sans-serif;font-size:var( --e-global-typography-df58ad6-font-size );line-height:var( --e-global-typography-df58ad6-line-height );letter-spacing:var( --e-global-typography-df58ad6-letter-spacing );word-spacing:var( --e-global-typography-df58ad6-word-spacing );color:var( --e-global-color-1b7c756 );width:var( --container-widget-width, 55% );max-width:55%;--container-widget-width:55%;--container-widget-flex-grow:0;}.elementor-17726 .elementor-element.elementor-element-4d53eb8 .primary-link{color:#000;}.elementor-17726 .elementor-element.elementor-element-4d53eb8 .primary-button{font-family:var( --e-global-typography-967bde5-font-family ), Sans-serif;font-size:var( --e-global-typography-967bde5-font-size );font-weight:var( --e-global-typography-967bde5-font-weight );text-transform:var( --e-global-typography-967bde5-text-transform );line-height:var( --e-global-typography-967bde5-line-height );letter-spacing:var( --e-global-typography-967bde5-letter-spacing );word-spacing:var( --e-global-typography-967bde5-word-spacing );}@media(min-width:2400px){.elementor-17726 .elementor-element.elementor-element-b33ec3d .elementor-heading-title{font-size:var( --e-global-typography-09506f0-font-size );line-height:var( --e-global-typography-09506f0-line-height );letter-spacing:var( --e-global-typography-09506f0-letter-spacing );word-spacing:var( --e-global-typography-09506f0-word-spacing );}.elementor-17726 .elementor-element.elementor-element-3e8986d{font-size:var( --e-global-typography-df58ad6-font-size );line-height:var( --e-global-typography-df58ad6-line-height );letter-spacing:var( --e-global-typography-df58ad6-letter-spacing );word-spacing:var( --e-global-typography-df58ad6-word-spacing );}.elementor-17726 .elementor-element.elementor-element-4d53eb8 .primary-button{font-size:var( --e-global-typography-967bde5-font-size );line-height:var( --e-global-typography-967bde5-line-height );letter-spacing:var( --e-global-typography-967bde5-letter-spacing );word-spacing:var( --e-global-typography-967bde5-word-spacing );}}@media(max-width:1366px){.elementor-17726 .elementor-element.elementor-element-b33ec3d .elementor-heading-title{font-size:var( --e-global-typography-09506f0-font-size );line-height:var( --e-global-typography-09506f0-line-height );letter-spacing:var( --e-global-typography-09506f0-letter-spacing );word-spacing:var( --e-global-typography-09506f0-word-spacing );}.elementor-17726 .elementor-element.elementor-element-3e8986d{font-size:var( --e-global-typography-df58ad6-font-size );line-height:var( --e-global-typography-df58ad6-line-height );letter-spacing:var( --e-global-typography-df58ad6-letter-spacing );word-spacing:var( --e-global-typography-df58ad6-word-spacing );--container-widget-width:65%;--container-widget-flex-grow:0;width:var( --container-widget-width, 65% );max-width:65%;}.elementor-17726 .elementor-element.elementor-element-4d53eb8 .primary-button{font-size:var( --e-global-typography-967bde5-font-size );line-height:var( --e-global-typography-967bde5-line-height );letter-spacing:var( --e-global-typography-967bde5-letter-spacing );word-spacing:var( --e-global-typography-967bde5-word-spacing );}}@media(max-width:1200px){.elementor-17726 .elementor-element.elementor-element-3e8986d{--container-widget-width:75%;--container-widget-flex-grow:0;width:var( --container-widget-width, 75% );max-width:75%;}}@media(max-width:1024px){.elementor-17726 .elementor-element.elementor-element-b33ec3d .elementor-heading-title{font-size:var( --e-global-typography-09506f0-font-size );line-height:var( --e-global-typography-09506f0-line-height );letter-spacing:var( --e-global-typography-09506f0-letter-spacing );word-spacing:var( --e-global-typography-09506f0-word-spacing );}.elementor-17726 .elementor-element.elementor-element-3e8986d{font-size:var( --e-global-typography-df58ad6-font-size );line-height:var( --e-global-typography-df58ad6-line-height );letter-spacing:var( --e-global-typography-df58ad6-letter-spacing );word-spacing:var( --e-global-typography-df58ad6-word-spacing );}.elementor-17726 .elementor-element.elementor-element-4d53eb8 .primary-button{font-size:var( --e-global-typography-967bde5-font-size );line-height:var( --e-global-typography-967bde5-line-height );letter-spacing:var( --e-global-typography-967bde5-letter-spacing );word-spacing:var( --e-global-typography-967bde5-word-spacing );}}@media(max-width:880px){.elementor-17726 .elementor-element.elementor-element-3e8986d{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}}@media(max-width:767px){.elementor-17726 .elementor-element.elementor-element-9dc7cd0{--min-height:450px;}.elementor-17726 .elementor-element.elementor-element-b33ec3d .elementor-heading-title{font-size:var( --e-global-typography-09506f0-font-size );line-height:var( --e-global-typography-09506f0-line-height );letter-spacing:var( --e-global-typography-09506f0-letter-spacing );word-spacing:var( --e-global-typography-09506f0-word-spacing );}.elementor-17726 .elementor-element.elementor-element-3e8986d{font-size:var( --e-global-typography-df58ad6-font-size );line-height:var( --e-global-typography-df58ad6-line-height );letter-spacing:var( --e-global-typography-df58ad6-letter-spacing );word-spacing:var( --e-global-typography-df58ad6-word-spacing );}.elementor-17726 .elementor-element.elementor-element-4d53eb8 .primary-button{font-size:var( --e-global-typography-967bde5-font-size );line-height:var( --e-global-typography-967bde5-line-height );letter-spacing:var( --e-global-typography-967bde5-letter-spacing );word-spacing:var( --e-global-typography-967bde5-word-spacing );}}\/* Start Custom Fonts CSS *\/@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Regular.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: bold;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Bold.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 100;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Thin.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 200;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-ExtraLight.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 300;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Light.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 400;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Regular.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 500;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Medium.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 600;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-SemiBold.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 700;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Bold.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 800;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-ExtraBold.ttf') format('truetype');\n}\n@font-face {\n\tfont-family: 'outfit';\n\tfont-style: normal;\n\tfont-weight: 900;\n\tfont-display: auto;\n\tsrc: url('https:\/\/hivecreatives.se\/wp-content\/uploads\/2025\/03\/Outfit-Black.ttf') format('truetype');\n}\n\/* End Custom Fonts CSS *\/<\/style>\n<p><!-- start Creative Button --><\/p>\n<style>\/* widget: Creative Button *\/\n\/* Button Filter SVG *\/\n#uc_creative_button_elementor_4d53eb8 svg {\n      width: 0;\n      height: 0;\n      position: absolute;\n      display: none;\n    }\n    \/* Main Button Styling *\/\n#uc_creative_button_elementor_4d53eb8 {\n      position: relative;\n        display: inline-block;\n    overflow: visible;\n      align-items: center;\n   padding: 10px 0px;\n      justify-content: center;\n      margin-right: 40px;\n      background-color: #FFCA42;\n      color: #000; \/* Primary color *\/\n      text-decoration: none;\n      border: none;\n      filter: url(#buttonFilter);\n      cursor: pointer;\n      border-radius:500px;\n    }\n#uc_creative_button_elementor_4d53eb8 .primary-link {\ncolor:#000;\n   font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  font-style: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n    text-decoration: none;\n    padding: 10px 20px;\n}\n    \/* Arrow Icon Styling *\/\n#uc_creative_button_elementor_4d53eb8 .icon-span {\n      position: absolute;\n      top: 50%;\n      left: 100%;\n      transform: translateY(-50%);\n      background-color: #FFCA42;\n      width: fit-content;\n  \tpadding:10px;\n      height: 100%;\n      display: grid;\n      place-content: center;\n      border-radius: 50%;\n      transition: all 0.3s ease-in-out;\n    }\n#uc_creative_button_elementor_4d53eb8:hover .icon-span {\n      left: calc(100% + 10px);\n      transform: translateY(-50%) rotate(-45deg);\n    }\n#uc_creative_button_elementor_4d53eb8 .arrow-icon {\n      border: solid black;\n      border-width: 0 2px 2px 0;\n      display: inline-block;\n      padding: 5px;\n      transform: rotate(-45deg);\n      -webkit-transform: rotate(-45deg);\n    }\n    @media (min-width: 768px) {\n#uc_creative_button_elementor_4d53eb8 .primary-link {\n        padding: 15px 30px;\n      }\n      #uc_creative_button_elementor_4d53eb8 {\n        padding: 15px 0px;\n      }\n      #uc_creative_button_elementor_4d53eb8 .icon-span {\n  \tpadding:15px;\n    }        \n    }\n<\/style>\n<p>  <svg color-interpolation-filters=\"sRGB\">\n    <defs>\n      <filter id=\"buttonFilter\">\n        <feGaussianBlur in=\"SourceGraphic\" stdDeviation=\"7\" result=\"blur\"><\/feGaussianBlur>\n        <feColorMatrix\n          in=\"blur\"\n          mode=\"matrix\"\n          values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9\"\n          result=\"buttonFilter\"\n        ><\/feColorMatrix>\n        <feComposite in=\"SourceGraphic\" in2=\"buttonFilter\" operator=\"atop\"><\/feComposite>\n        <feBlend in=\"SourceGraphic\" in2=\"buttonFilter\"><\/feBlend>\n      <\/filter>\n    <\/defs>\n  <\/svg><br \/>\n  <!-- Button --><br \/>\n  <a href=\"\" ><br \/>\n  <\/a><br \/>\n<!-- end Creative Button -->\t\t\t\t<\/p>\n<h2>Design that builds brand and drives business<\/h2>\n<p>Web design is not just about colors, fonts, and layout \u2013 it\u2019s about how people perceive your business at first glance. In a digital world where competition is fierce and decision paths are short, design plays a crucial role in how long a visitor stays, what they perceive, and whether they choose to act.<\/p>\n<p>A professional web design strengthens your brand, conveys the right emotion, and guides the user to the next step \u2013 whether it\u2019s to buy, book, contact, or simply understand what you offer. By combining strategy, aesthetics, and user-centered design, we create digital experiences that not only look good, but also work in practice. The result is a website that engages, converts, and grows with your business.<\/p>\n<p>\t\t\t\t\tDesign services\t\t\t\t<\/p>\n<h2>Our design services<\/h2>\n<p>We offer a holistic perspective on digital design \u2013 from strategy and user flows to visual expression and conversion. Our design services help you shape digital environments that engage, build trust and lead to action.<\/p>\n<h3>UX\/UI Design<br \/>\n<\/h3>\n<p>Graphic design that guides, engages and feels natural to use.<\/p>\n<p><!-- start Creative Button --><\/p>\n<style>\/* widget: Creative Button *\/\n\/* Button Filter SVG *\/\n#uc_creative_button_elementor_4f9b5a3 svg {\n      width: 0;\n      height: 0;\n      position: absolute;\n      display: none;\n    }\n    \/* Main Button Styling *\/\n#uc_creative_button_elementor_4f9b5a3 {\n      position: relative;\n        display: inline-block;\n    overflow: visible;\n      align-items: center;\n   padding: 10px 0px;\n      justify-content: center;\n      margin-right: 40px;\n      background-color: #222222;\n      color: #FFFFFF; \/* Primary color *\/\n      text-decoration: none;\n      border: none;\n      filter: url(#buttonFilter);\n      cursor: pointer;\n      border-radius:500px;\n    }\n#uc_creative_button_elementor_4f9b5a3 .primary-link {\ncolor:#FFFFFF;\n   font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  font-style: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n    text-decoration: none;\n    padding: 10px 20px;\n}\n    \/* Arrow Icon Styling *\/\n#uc_creative_button_elementor_4f9b5a3 .icon-span {\n      position: absolute;\n      top: 50%;\n      left: 100%;\n      transform: translateY(-50%);\n      background-color: #222222;\n      width: fit-content;\n  \tpadding:10px;\n      height: 100%;\n      display: grid;\n      place-content: center;\n      border-radius: 50%;\n      transition: all 0.3s ease-in-out;\n    }\n#uc_creative_button_elementor_4f9b5a3:hover .icon-span {\n      left: calc(100% + 10px);\n      transform: translateY(-50%) rotate(-45deg);\n    }\n#uc_creative_button_elementor_4f9b5a3 .arrow-icon {\n      border: solid black;\n      border-width: 0 2px 2px 0;\n      display: inline-block;\n      padding: 5px;\n      transform: rotate(-45deg);\n      -webkit-transform: rotate(-45deg);\n    }\n    @media (min-width: 768px) {\n#uc_creative_button_elementor_4f9b5a3 .primary-link {\n        padding: 15px 30px;\n      }\n      #uc_creative_button_elementor_4f9b5a3 {\n        padding: 15px 0px;\n      }\n      #uc_creative_button_elementor_4f9b5a3 .icon-span {\n  \tpadding:15px;\n    }        \n    }\n<\/style>\n<p>  <svg color-interpolation-filters=\"sRGB\">\n    <defs>\n      <filter id=\"buttonFilter\">\n        <feGaussianBlur in=\"SourceGraphic\" stdDeviation=\"7\" result=\"blur\"><\/feGaussianBlur>\n        <feColorMatrix\n          in=\"blur\"\n          mode=\"matrix\"\n          values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9\"\n          result=\"buttonFilter\"\n        ><\/feColorMatrix>\n        <feComposite in=\"SourceGraphic\" in2=\"buttonFilter\" operator=\"atop\"><\/feComposite>\n        <feBlend in=\"SourceGraphic\" in2=\"buttonFilter\"><\/feBlend>\n      <\/filter>\n    <\/defs>\n  <\/svg><br \/>\n  <!-- Button --><br \/>\n  <a href=\"\" ><br \/>\n    Read more<br \/>\n  <\/a><br \/>\n<!-- end Creative Button -->\t\t\t\t<\/p>\n<h3>Conversion optimization<\/h3>\n<p>We design for action \u2013 more clicks, leads and conversions.<\/p>\n<p><!-- start Creative Button --><\/p>\n<style>\/* widget: Creative Button *\/\n\/* Button Filter SVG *\/\n#uc_creative_button_elementor_b747fc3 svg {\n      width: 0;\n      height: 0;\n      position: absolute;\n      display: none;\n    }\n    \/* Main Button Styling *\/\n#uc_creative_button_elementor_b747fc3 {\n      position: relative;\n        display: inline-block;\n    overflow: visible;\n      align-items: center;\n   padding: 10px 0px;\n      justify-content: center;\n      margin-right: 40px;\n      background-color: #FFCA42;\n      color: #222222; \/* Primary color *\/\n      text-decoration: none;\n      border: none;\n      filter: url(#buttonFilter);\n      cursor: pointer;\n      border-radius:500px;\n    }\n#uc_creative_button_elementor_b747fc3 .primary-link {\ncolor:#222222;\n   font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  font-style: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n    text-decoration: none;\n    padding: 10px 20px;\n}\n    \/* Arrow Icon Styling *\/\n#uc_creative_button_elementor_b747fc3 .icon-span {\n      position: absolute;\n      top: 50%;\n      left: 100%;\n      transform: translateY(-50%);\n      background-color: #FFCA42;\n      width: fit-content;\n  \tpadding:10px;\n      height: 100%;\n      display: grid;\n      place-content: center;\n      border-radius: 50%;\n      transition: all 0.3s ease-in-out;\n    }\n#uc_creative_button_elementor_b747fc3:hover .icon-span {\n      left: calc(100% + 10px);\n      transform: translateY(-50%) rotate(-45deg);\n    }\n#uc_creative_button_elementor_b747fc3 .arrow-icon {\n      border: solid black;\n      border-width: 0 2px 2px 0;\n      display: inline-block;\n      padding: 5px;\n      transform: rotate(-45deg);\n      -webkit-transform: rotate(-45deg);\n    }\n    @media (min-width: 768px) {\n#uc_creative_button_elementor_b747fc3 .primary-link {\n        padding: 15px 30px;\n      }\n      #uc_creative_button_elementor_b747fc3 {\n        padding: 15px 0px;\n      }\n      #uc_creative_button_elementor_b747fc3 .icon-span {\n  \tpadding:15px;\n    }        \n    }\n<\/style>\n<p>  <svg color-interpolation-filters=\"sRGB\">\n    <defs>\n      <filter id=\"buttonFilter\">\n        <feGaussianBlur in=\"SourceGraphic\" stdDeviation=\"7\" result=\"blur\"><\/feGaussianBlur>\n        <feColorMatrix\n          in=\"blur\"\n          mode=\"matrix\"\n          values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9\"\n          result=\"buttonFilter\"\n        ><\/feColorMatrix>\n        <feComposite in=\"SourceGraphic\" in2=\"buttonFilter\" operator=\"atop\"><\/feComposite>\n        <feBlend in=\"SourceGraphic\" in2=\"buttonFilter\"><\/feBlend>\n      <\/filter>\n    <\/defs>\n  <\/svg><br \/>\n  <!-- Button --><br \/>\n  <a href=\"\" ><br \/>\n    Read more<br \/>\n  <\/a><br \/>\n<!-- end Creative Button -->\t\t\t\t<\/p>\n<h3>Figma<\/h3>\n<p>We visualize the design in Figma before development.<\/p>\n<p><!-- start Creative Button --><\/p>\n<style>\/* widget: Creative Button *\/\n\/* Button Filter SVG *\/\n#uc_creative_button_elementor_ca4f325 svg {\n      width: 0;\n      height: 0;\n      position: absolute;\n      display: none;\n    }\n    \/* Main Button Styling *\/\n#uc_creative_button_elementor_ca4f325 {\n      position: relative;\n        display: inline-block;\n    overflow: visible;\n      align-items: center;\n   padding: 10px 0px;\n      justify-content: center;\n      margin-right: 40px;\n      background-color: #222222;\n      color: #FFFFFF; \/* Primary color *\/\n      text-decoration: none;\n      border: none;\n      filter: url(#buttonFilter);\n      cursor: pointer;\n      border-radius:500px;\n    }\n#uc_creative_button_elementor_ca4f325 .primary-link {\ncolor:#FFFFFF;\n   font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  font-style: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n    text-decoration: none;\n    padding: 10px 20px;\n}\n    \/* Arrow Icon Styling *\/\n#uc_creative_button_elementor_ca4f325 .icon-span {\n      position: absolute;\n      top: 50%;\n      left: 100%;\n      transform: translateY(-50%);\n      background-color: #222222;\n      width: fit-content;\n  \tpadding:10px;\n      height: 100%;\n      display: grid;\n      place-content: center;\n      border-radius: 50%;\n      transition: all 0.3s ease-in-out;\n    }\n#uc_creative_button_elementor_ca4f325:hover .icon-span {\n      left: calc(100% + 10px);\n      transform: translateY(-50%) rotate(-45deg);\n    }\n#uc_creative_button_elementor_ca4f325 .arrow-icon {\n      border: solid black;\n      border-width: 0 2px 2px 0;\n      display: inline-block;\n      padding: 5px;\n      transform: rotate(-45deg);\n      -webkit-transform: rotate(-45deg);\n    }\n    @media (min-width: 768px) {\n#uc_creative_button_elementor_ca4f325 .primary-link {\n        padding: 15px 30px;\n      }\n      #uc_creative_button_elementor_ca4f325 {\n        padding: 15px 0px;\n      }\n      #uc_creative_button_elementor_ca4f325 .icon-span {\n  \tpadding:15px;\n    }        \n    }\n<\/style>\n<p>  <svg color-interpolation-filters=\"sRGB\">\n    <defs>\n      <filter id=\"buttonFilter\">\n        <feGaussianBlur in=\"SourceGraphic\" stdDeviation=\"7\" result=\"blur\"><\/feGaussianBlur>\n        <feColorMatrix\n          in=\"blur\"\n          mode=\"matrix\"\n          values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9\"\n          result=\"buttonFilter\"\n        ><\/feColorMatrix>\n        <feComposite in=\"SourceGraphic\" in2=\"buttonFilter\" operator=\"atop\"><\/feComposite>\n        <feBlend in=\"SourceGraphic\" in2=\"buttonFilter\"><\/feBlend>\n      <\/filter>\n    <\/defs>\n  <\/svg><br \/>\n  <!-- Button --><br \/>\n  <a href=\"\" ><br \/>\n    Read more<br \/>\n  <\/a><br \/>\n<!-- end Creative Button -->\t\t\t\t<\/p>\n<h2>Ready to take the next step?<\/h2>\n<p>We listen, analyze and shape a path forward that reflects your goals. Get in touch \u2013 and we\u2019ll start where you are. Contact us<\/p>\n<p><!-- start Creative Button --><\/p>\n<style>\/* widget: Creative Button *\/\n\/* Button Filter SVG *\/\n#uc_creative_button_elementor_bdd782d svg {\n      width: 0;\n      height: 0;\n      position: absolute;\n      display: none;\n    }\n    \/* Main Button Styling *\/\n#uc_creative_button_elementor_bdd782d {\n      position: relative;\n        display: inline-block;\n    overflow: visible;\n      align-items: center;\n   padding: 10px 0px;\n      justify-content: center;\n      margin-right: 40px;\n      background-color: #FFFFFF;\n      color: #222222; \/* Primary color *\/\n      text-decoration: none;\n      border: none;\n      filter: url(#buttonFilter);\n      cursor: pointer;\n      border-radius:500px;\n    }\n#uc_creative_button_elementor_bdd782d .primary-link {\ncolor:#222222;\n   font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  font-style: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n    text-decoration: none;\n    padding: 10px 20px;\n}\n    \/* Arrow Icon Styling *\/\n#uc_creative_button_elementor_bdd782d .icon-span {\n      position: absolute;\n      top: 50%;\n      left: 100%;\n      transform: translateY(-50%);\n      background-color: #FFFFFF;\n      width: fit-content;\n  \tpadding:10px;\n      height: 100%;\n      display: grid;\n      place-content: center;\n      border-radius: 50%;\n      transition: all 0.3s ease-in-out;\n    }\n#uc_creative_button_elementor_bdd782d:hover .icon-span {\n      left: calc(100% + 10px);\n      transform: translateY(-50%) rotate(-45deg);\n    }\n#uc_creative_button_elementor_bdd782d .arrow-icon {\n      border: solid black;\n      border-width: 0 2px 2px 0;\n      display: inline-block;\n      padding: 5px;\n      transform: rotate(-45deg);\n      -webkit-transform: rotate(-45deg);\n    }\n    @media (min-width: 768px) {\n#uc_creative_button_elementor_bdd782d .primary-link {\n        padding: 15px 30px;\n      }\n      #uc_creative_button_elementor_bdd782d {\n        padding: 15px 0px;\n      }\n      #uc_creative_button_elementor_bdd782d .icon-span {\n  \tpadding:15px;\n    }        \n    }\n<\/style>\n<p>  <svg color-interpolation-filters=\"sRGB\">\n    <defs>\n      <filter id=\"buttonFilter\">\n        <feGaussianBlur in=\"SourceGraphic\" stdDeviation=\"7\" result=\"blur\"><\/feGaussianBlur>\n        <feColorMatrix\n          in=\"blur\"\n          mode=\"matrix\"\n          values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9\"\n          result=\"buttonFilter\"\n        ><\/feColorMatrix>\n        <feComposite in=\"SourceGraphic\" in2=\"buttonFilter\" operator=\"atop\"><\/feComposite>\n        <feBlend in=\"SourceGraphic\" in2=\"buttonFilter\"><\/feBlend>\n      <\/filter>\n    <\/defs>\n  <\/svg><br \/>\n  <!-- Button --><br \/>\n  <a href=\"\" ><br \/>\n    Contact us<br \/>\n  <\/a><br \/>\n<!-- end Creative Button --><br \/>\n\t\t\t\t\tOur Process\t\t\t\t<\/p>\n<h2>How we create web design that makes a difference<\/h2>\n<p>Good design doesn\u2019t happen by accident \u2013 \u200b\u200bit\u2019s the result of insight, structure and a clear direction. Our design process is designed to create digital experiences that are both visually striking and functionally smart. By working closely with you every step of the way, we ensure that the end result not only reflects your brand \u2013 but also makes a real difference for your users and your business.<\/p>\n<h3>\n\t\t\t\t\t\t\tInsight &#038; understanding<br \/>\n\t\t\t\t\t<\/h3>\n<p>\n\t\t\t\t\t\tEvery project starts with us listening. We understand your goals, your users and what you want to achieve. Through workshops, target group analysis and current situation mapping, we build a common foundation \u2013 both strategically and creatively.\t\t\t\t\t<\/p>\n<p>\t\t\t\t\t01\t\t\t\t<\/p>\n<h3>\n\t\t\t\t\t\t\tStructure &#038; direction<br \/>\n\t\t\t\t\t<\/h3>\n<p>\n\t\t\t\t\t\tWe define content structure, navigation flows and set a clear direction for the design. We develop user personas, review the customer journey and analyze competitors \u2013 all to understand how to best guide your visitors towards the right decision.\t\t\t\t\t<\/p>\n<p>\t\t\t\t\t02\t\t\t\t<\/p>\n<h3>\n\t\t\t\t\t\t\tWireframes &#038; user flows<br \/>\n\t\t\t\t\t<\/h3>\n<p>\n\t\t\t\t\t\tWith structure and insights in place, we sketch out wireframes \u2013 simple layouts that show how content and features are connected. This gives both you and us a common picture of the structure of the pages before we dress them up in visual design.\t\t\t\t\t<\/p>\n<p>\t\t\t\t\t03\t\t\t\t<\/p>\n<h3>\n\t\t\t\t\t\t\tVisual design &#038; prototype<br \/>\n\t\t\t\t\t<\/h3>\n<p>\n\t\t\t\t\t\tWe design the interface in Figma and build a clickable prototype. Here we test color, shape, font, and tonality \u2013 always with a focus on accessibility, brand identity, and usability. You get a live preview of how everything will feel.\t\t\t\t\t<\/p>\n<p>\t\t\t\t\t04\t\t\t\t<\/p>\n<h3>\n\t\t\t\t\t\t\tDelivery &#038; documentation<br \/>\n\t\t\t\t\t<\/h3>\n<p>\n\t\t\t\t\t\tOnce the design is approved, we deliver complete design files, guidelines and documentation ready for development. We ensure that everything is clear and the handover is smooth \u2013 whether we build on it or you do it in-house.\t\t\t\t\t<\/p>\n<p>\t\t\t\t\t05\t\t\t\t<\/p>\n<h2>What is WCAG?<br \/>\n<\/h2>\n<p>WCAG stands for Web Content Accessibility Guidelines and is an international framework for how digital content should be designed to be accessible to everyone \u2013 regardless of functional variation, device or technical prerequisite.<\/p>\n<p>The guidelines cover, among other things, contrasts, text size, keyboard navigation and how content should be perceived by screen readers. By following WCAG, we ensure that your website works for more people, meets requirements and offers an inclusive experience. It is not only important \u2013 it is smart, sustainable and in line with a modern brand.<\/p>\n<h2>Frequently asked questions about design<\/h2>\n<details id=\"e-n-accordion-item-2110\" open>\n<summary data-accordion-index=\"1\" tabindex=\"0\" aria-expanded=\"true\" aria-controls=\"e-n-accordion-item-2110\" >\n<h3> What is the difference between web design and web development? <\/h3>\n<\/summary>\n<p>Web design is about how a website looks and works from the user&#8217;s perspective \u2013 colors, fonts, layout, flows and experience. Web development is the technical work behind it \u2013 that is, converting the design into code so that the website works as it should. At our company, designers and developers work closely together to create complete solutions that both look good and perform.<\/p>\n<\/details>\n<details id=\"e-n-accordion-item-2111\" >\n<summary data-accordion-index=\"2\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-2111\" >\n<h3> Do you need to think about SEO already in the design phase? <\/h3>\n<\/summary>\n<p>Yes, absolutely. Design choices affect both how search engines interpret content and how users interact with the site. We ensure that the structure is logical, that heading hierarchies are followed, and that important pages get the right visibility \u2013 all to create the best conditions for SEO right from the start.<\/p>\n<\/details>\n<details id=\"e-n-accordion-item-2112\" >\n<summary data-accordion-index=\"3\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-2112\" >\n<h3> Do you also design for e-commerce? <\/h3>\n<\/summary>\n<p>Yes, we have extensive experience designing for e-commerce \u2013 both for larger stores and niche brands. We focus on creating a shopping experience that is simple, secure and converting, regardless of platform. Everything from product presentation to cash flow is designed with both users and business goals in focus.<\/p>\n<\/details>\n<details id=\"e-n-accordion-item-2113\" >\n<summary data-accordion-index=\"4\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-2113\" >\n<h3> Can you help with a graphic profile? <\/h3>\n<\/summary>\n<p>Yes, we are happy to help you develop a graphic profile that reflects your brand&#8217;s personality, values \u200b\u200band target audience. A clear graphic identity creates recognition and provides a common thread in all communication &#8211; from web design and social media to presentations and printed materials. We can both develop completely new visual guidelines or further develop an existing profile.<\/p>\n<\/details>\n<p>Web design is about how a website looks and works from the user&#8217;s perspective \u2013 colors, fonts, layout, flows and experience. Web development is the technical work behind it \u2013 that is, converting the design into code so that the website works as it should. At our company, designers and developers work closely together to create complete solutions that both look good and perform.<\/p>\n<p>Yes, absolutely. Design choices affect both how search engines interpret content and how users interact with the site. We ensure that the structure is logical, that heading hierarchies are followed, and that important pages get the right visibility \u2013 all to create the best conditions for SEO right from the start.<\/p>\n<p>Yes, we have extensive experience designing for e-commerce \u2013 both for larger stores and niche brands. We focus on creating a shopping experience that is simple, secure and converting, regardless of platform. Everything from product presentation to cash flow is designed with both users and business goals in focus.<\/p>\n<p>Yes, we are happy to help you develop a graphic profile that reflects your brand&#8217;s personality, values \u200b\u200band target audience. A clear graphic identity creates recognition and provides a common thread in all communication &#8211; from web design and social media to presentations and printed materials. We can both develop completely new visual guidelines or further develop an existing profile.<\/p>\n","protected":false},"parent":0,"menu_order":0,"template":"","service-category":[47],"class_list":{"0":"post-17488","1":"services","2":"type-services","3":"status-publish","5":"service-category-design-en"},"acf":[],"_links":{"self":[{"href":"https:\/\/hivecreatives.se\/en\/wp-json\/wp\/v2\/services\/17488","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hivecreatives.se\/en\/wp-json\/wp\/v2\/services"}],"about":[{"href":"https:\/\/hivecreatives.se\/en\/wp-json\/wp\/v2\/types\/services"}],"version-history":[{"count":3,"href":"https:\/\/hivecreatives.se\/en\/wp-json\/wp\/v2\/services\/17488\/revisions"}],"predecessor-version":[{"id":46293,"href":"https:\/\/hivecreatives.se\/en\/wp-json\/wp\/v2\/services\/17488\/revisions\/46293"}],"wp:attachment":[{"href":"https:\/\/hivecreatives.se\/en\/wp-json\/wp\/v2\/media?parent=17488"}],"wp:term":[{"taxonomy":"service-category","embeddable":true,"href":"https:\/\/hivecreatives.se\/en\/wp-json\/wp\/v2\/service-category?post=17488"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}