iOTEK

Overview

iOTEK runs seven distinct product divisions under one company name — telematics and fleet tracking, SIM and cellular connectivity, private networking, safety monitoring, electronic shelf labels (ESL), telehealth, and proof-of-concept deployments — each serving a different corner of the industrial-connectivity market. I joined the company as a full-time remote employee in the Marketing department, officially titled Graphic Designer, though the work itself spanned graphic design, UI/UX design, and junior front-end development. Over approximately 5–6 months — an engagement that's still ongoing — I was the sole designer and developer behind replacing iOTEK's outdated website with a new bilingual, production-ready site, and behind the brand system that now holds it together.

Project Summary

• Role: Graphic Designer (official title) — UI/UX Design & Junior Front-End Development (actual scope)
• Duration: ~5–6 months (ongoing)
• Employment: Full-time remote
• Department: Marketing — reporting to Alexie Falú (COO & CTO) and Kiara Gerena (Marketing Manager)
• Platform: Astro, Tailwind CSS, deployed on Vercel
• Industry: IoT / Industrial Connectivity
• Deliverables: Brand identity system, bilingual production website, CRM-integrated lead generation, marketing collateral

Business Context

The website and brand materials iOTEK had going into this engagement predated its current multi-division structure. An audit of the existing asset library turned up real inconsistencies — naming mismatches, misfiled brand files — that made clear the identity had never been built to scale across seven divisions at once. The company's audience spans both English- and Spanish-speaking markets, and the marketing team needed the site to function as an active lead-generation tool, not a static brochure.

Challenge

iOTEK wasn't asking for a simple redesign. The company needed one digital presence that could hold seven distinct divisions together as a single recognizable brand, work equally well in two languages, and connect directly into the sales team's CRM — without interrupting a business that already had real clients depending on it.

That meant solving the problem at two levels. At the product level, each division needed its own identity within a shared system, not a stand-alone brand competing for attention. At the technical level, the site had to be bilingual from the ground up, support both light and dark presentation, and turn visitor interest into qualified leads inside iOTEK's existing CRM — all built and shipped by one person, alongside the brand system it depended on.

Design to Development

The brand audit above is where the actual work started. Before any front-end code, I turned those findings into a complete brand manual: logo construction and safe area, a primary and secondary color palette, a two-typeface system, and a dedicated sub-brand treatment for each of iOTEK's divisions. The goal was a production-ready system, not a one-off refresh.

Translating that system into the live website was my responsibility too — there was no separate front-end team to hand it off to. Business direction and requirements came from Alexie Falú; the interface design, information architecture, and implementation were mine to execute end to end.

Solution

With that scope defined, the build followed three threads: one system for the divisions, one experience for both languages, and one path from visitor to lead.

I built the site in Astro with Tailwind CSS, structuring content around each division and its products so the same underlying data could drive the homepage, division presentation, and product detail views without duplicating content by hand. Bilingual support and a light/dark theme were both built directly into the front end, switching instantly for the visitor without a page reload, so the experience felt native in either language rather than translated after the fact.

Rather than leaving the contact page as a passive form, I integrated the site directly with the company's existing CRM, so visitor inquiries flow straight into the sales team's pipeline as real leads. I also built the site's blog/news system for ongoing company updates and produced the surrounding bilingual marketing collateral — sales materials and a newsletter — that the marketing team could use independently of the site itself.

Outcome

The engagement replaced iOTEK's outdated site with a complete, bilingual, production website — backed by a brand system built to scale across the company's full range of divisions rather than patched together division by division. The site now presents iOTEK's real client work, including deployments with Power Solar, ConWaste, and Central Industrial, and channels visitor interest directly into the company's CRM instead of leaving it stranded in a static form. Content added since the initial build, like newer blog posts, has continued under the marketing team; the design, architecture, and implementation of the site itself were mine alone.

What started as seven divisions without a shared visual language or a working lead-generation path ended as one connected system — a company that finally looks, reads, and functions like a single business online.

My Contributions

• Led the end-to-end design and front-end implementation of iOTEK's production website, from initial architecture through deployment
• Authored the company's brand identity system — logo, color, typography, and a dedicated visual treatment for each product division — from an original asset audit
• Built the bilingual (English/Spanish) experience and the light/dark theme system directly into the front end
• Integrated the website with the company's CRM to convert visitor interest into real sales leads
• Built the site's blog/news system for ongoing company content
• Produced supporting bilingual marketing collateral, including sales materials and a newsletter
• Owned execution solo — from Alexie Falú's business direction through to a live, deployed product

Technologies

• Platform: Vercel
• Framework: Astro
• Styling: Tailwind CSS
• Integration: CRM (lead capture and routing)
• Design: Pencil (brand and design system)