As a visual designer passionate about leaving a lasting impression, I delved into the realm of animation. The result—a visually captivating, animated version of the iTwinUI icon. This dynamic visual asset served a dual purpose, not just as a symbol of the design system but also as an engaging placeholder at the start of iTwinUI-related presentations. Beyond functionality, it injected a touch of creativity and anticipation, setting the stage for meaningful discussions and collaborations.
]]>Aside from a 3D printer, here are the other pieces required to put together:
This was a complicated task in many ways. We needed to find a solution that was easy enough for non-coders to use, but that had enough features to allow us to accomplish our goals. We also needed the UX team’s buy-in on the new platform; if the team didn’t like using the service, they would dread maintaining it, and it would fail over time. We were in search of a final, permanent solution. Spoiler alert: we ended up building our own! 🤫
I was excited to take on this challenge and lead the team responsible for finding a solution for this problem that had frustrated the team since I first joined nearly 7 years ago. After discussing the task in more depth we came up with the following plan:
After researching options it became clear that we needed a custom solution, but the company was unable to devote developer time to building an internal-only tool. We were determined to find a final solution that would please all parties involved and that’s exactly what we did. Here’s what we came up with.
Due to IT’s restrictions and the need for high levels of customizability yet ease of use, I felt that a static site generator would fit the bill. We decided to build our sites using Jekyll: a flexible static site generator that is built upon Ruby. Content is authored in kramdown, and complex statements are built using Liquid.
Bentley Systems is heavily invested in Microsoft services, so we decided to use Azure DevOps to assign tasks, link those tasks to files within the repository, and then automate builds and deployments using DevOps pipelines. Getting the DevOps pipelines to completion was a collaboration between the UX team, developers, and the IT department, as this was very much outside of the UX team’s skillset.
The visual appearance of all the UX sites were designed to look similar. The 3 platform sites had identical layouts and content structure. The UX Home, Icons, and Workflows sites had slightly different usecases than the platform sites so the layout of those sites were adjusted to best suit the user needs.
Because all of the sites had matching layouts now, the uniqueness of each platform was somewhat lost. To solve this problem we relied on strong branding to give each platform a unique identity.
Once the site was deployed we knew we’d have many UX team members contributing content to the site. We needed to define a workflow for our content authors not only so the site structure remains clean & efficient, but so there is general team consensus on new standards being approved. We came up with a process and gave it the acronym PACE:
On we flipped the switch and UX.Bentley.com was announced throughout the company. Out of sheer excitement for the announcement I created a short Apple-esque marketing video that was intended to get people excited about the release but also to help associate each platform with its unique logo and branding color.
Since launch we used Google Analytics to track the site’s usage. Within a month of launch, we had increased active users by 16.67% and visits by 37.46%. Not only did this prove that the sites were being used, it also confirmed that our plans to spread the word and to keep everyone in the loop were working.
We noticed an increase in discussion not only between us and developers but between development teams. There have also been fewer misdirected emails as the websites make it very easy to discover who is the subject matter expert on any subject and how to get in touch with them. The websites are often used by the UX team for decision making and backing. Being able to link a developer to an official looking website increased the wider teams confidence in the standards that the UX team has developed.
We initially only launched 2 sites: the UX home page & Bentley Web Components, also known as BWC. As of , we housed eight unique sites under the UX subdomain. Below is a hierarchical overview of the sites on the UX subdomain.
Since their inception, the UX sites have had a lot of content created and shared. As of this writing, the sites have grown immensely and continue to grow at a steady pace.
I love it!
]]>The UX sites are fantastic, a must have resource.
After JDX Music folded, Sogma created his own music production company, Sogma Productions, and asked me to help as his exclusive designer and all around tech guru. We collaborated over Skype for months and created a unique brand and launched a website to showcase the company’s work. Since then I have helped with pretty much any graphical work related to the Sogma brand.
Seeing that it had been nearly 8 years since we originally designed the Sogma brand and website we felt it was time for a new look. I have in the past 8 years greatly improved both my design and front end web development skills and was looking forward to the new challenge.
First things first, we had to figure out a plan and set some goals.
We started with the logo first. After a few weeks of on-off work, we had a new design sketched and I started creating it in Adobe Illustrator. Unfortunately, about halfway through designing the logo we discovered by pure chance DJ Blasco had a strikingly similar logo. 🤦♂️ Back to the drawing board.
So we started over from scratch. Another couple of weeks go by of on-off again work and we had another new design sketched out. In the end, the redesigned logo was a blessing in disguise as the client felt it gave off more of a super hero vibe better than the first design.
Sogma released a video using the new logo to tease his new EP release and give everyone a taste of the new branding. Note that the video was not created by me.
Since I do all the website maintenance and up keep, it was mostly my call as to what technology we would use. I was already experienced with Jekyll: a flexible static site generator that is built upon Ruby. I use Jekyll on a daily basis at Bentley Systems and was planning on redoing my personal site with it as well. The website is saved in a GitHub repo and is automatically built and deployed by Netlify.
Due to the tight time schedule, rather than spending time building and debugging a new layout, we decided to build the site upon the Wrap premium Jekyll theme created by Andy Lu. We then modified the theme to meet our needs. Some parts had to be re-written due to newer, better technologies becoming available while other parts were re-written because we thought we could do better. 😏
]]>Thank you so much for all your hard work.. The website kicks ass!! 😃