{"id":3519,"date":"2021-02-01T16:32:28","date_gmt":"2021-02-01T13:32:28","guid":{"rendered":"https:\/\/subsign.co\/stories\/?p=3519"},"modified":"2021-02-01T16:32:30","modified_gmt":"2021-02-01T13:32:30","slug":"surikatta","status":"publish","type":"post","link":"https:\/\/subsign.co\/stories\/surikatta\/","title":{"rendered":"Surikatta – project case study"},"content":{"rendered":"\n

Surikatta is a child company of the larger G4S. They approached us in designing the UI&UX for an iOS App aimed at the US market. The main goal of the app is to create a cohesive and friendly ecosystem with their smart home devices and a social platform where users can warn one another in case of danger.<\/span><\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

At first, similar to Nest and Ring, Surikatta wants to take the home security idea even further, giving access to your family members, getting notifications from the community, receiving alerts from the local authorities.<\/span><\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

The name Surikatta comes from Suricate or Meerkat, and is based on the idea that these tiny animals look after each other, and at the tiniest sign of danger they alert one another.<\/span><\/p>\n\n\n\n

The Workflow<\/b><\/h2>\n\n\n\n

One of the big challenges was to deliver a well put user experience throughout the entire persona range, from single moms, to older people and even young couples. Besides the UX, we also needed to deliver a trust-worthy feel, by the use of simple layouts, color combinations, icons and animations. <\/span><\/p>\n\n\n\n

Step 1<\/span>: Meeting and getting to know the team, and their existing products.<\/span> <\/p>\n\n\n\n

Step 2<\/span>: Speaking with their target audience, and identifying their needs.<\/span> <\/p>\n\n\n\n

Step 3<\/span>: Highlighting the strong points and the differentiators from the competition.<\/span> <\/p>\n\n\n\n

Step 4<\/span>: Initial Layouts & Quick Sketches during the intensive meetings.<\/span> <\/p>\n\n\n\n

Step 5<\/span>: Adding all the information into a complete wireframe of 56 screens that make a complete user flow.<\/span> <\/p>\n\n\n\n

Once the Wireframe was done, we started testing it out with the target audience and started to optimize different features or even Entire screens.<\/span><\/p>\n\n\n\n

The following print screens are just some of them:<\/span><\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n

Step 6<\/span>: Once the Wireframe was completed and tested on the personas, we started defining the Color scheme, fonts, buttons, icons and textures aligned with the Brand Guidelines.<\/span> <\/p>\n\n\n\n

Step 7<\/span>: After making sure that the design elements were aligned with the image and the direction we were aiming for, we\u2019ve started adding the elements over the finished wireframe.<\/span> <\/p>\n\n\n\n

Below are some examples of them:<\/span><\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n
\"\"<\/figure><\/div>\n\n\n\n

Step 8<\/span>: Transition animations and preparing the files for the Development Hand-off.<\/span> <\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

Step 9<\/span>: Starting the Development Phase.<\/span> <\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

The Challenge<\/b><\/h2>\n\n\n\n

The Challenge was to deliver an app that would carve out its own niche, and have a more human touch compared to its competitors. We also needed to deliver a solid sense of comfort and security, so that the users would feel at home. In order to do this we\u2019ve come up with different screens that put the house and the neighborhood in focus.<\/span><\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

The Final Product<\/b><\/h2>\n\n\n\n

This project is in the development stage, we should have a fully working beta this year.<\/span><\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

Feel free to take a look at the existing demonstrator: Marvel App<\/a><\/span><\/p>\n\n\n\n

We\u2019ve tested the demonstrator with a range of personas and as us they are awaiting the launch.<\/span><\/p>\n\n\n\n

Stay tuned.<\/span><\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

Give us a follow for a more digital marketing strategy to help or feel free to send us an email at hello@subsign.co<\/a> for collaborations or help with your brand\u2019s presence and content.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"

Surikatta is a child company of the larger G4S. They approached us in designing the UI&UX for an iOS App aimed at the US market. The main goal of the app is to create a cohesive and friendly ecosystem with their smart home devices and a social platform where users can warn one another in […]<\/p>\n","protected":false},"author":1,"featured_media":3561,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2,3,4],"tags":[],"class_list":["post-3519","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design","category-development","category-marketing"],"acf":[],"_links":{"self":[{"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/posts\/3519","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/comments?post=3519"}],"version-history":[{"count":26,"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/posts\/3519\/revisions"}],"predecessor-version":[{"id":3570,"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/posts\/3519\/revisions\/3570"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/media\/3561"}],"wp:attachment":[{"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/media?parent=3519"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/categories?post=3519"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/subsign.co\/stories\/wp-json\/wp\/v2\/tags?post=3519"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}