Eager

Helpdesk, Documentation Site, In-App Notifications, & More

Added a blog post. Working on SEO for that long term organic growth.

Fixed responsive layout.

Always tricky to deal with responsive layouts when using JavaScript to style the elements. Tip: Use window.matchMedia("(max-width: 992px)");

Completed basic customization of help widget for

How I did this: Loaded the widget as a preview within an iFrame, used a color picker library (https://www.npmjs.com/package/@simonwep/pickr). On the backend, the widget loader JS pulls the preferences dynamically via JSON and colors are updated using vanilla JS.

Help widget for is in progress. Got more done today than I thought I would.

Been improving on my JavaScript technical skills, and was able to figure out a lot of technical hurdles to get this done. Will be adding additional intra-widget widgets: documentation search, chat, notifications.

I'm really not good at CSS3 animations, but finally got the side widget to animate.

I'm not much of a UI centric person, but I really wanted to nail this effect. There's a part of the app (sidebar) that I wanted to slide out from the right. Previously I just toggled display between none/block, but I wanted some animation. I think I'll need to tweak the timing though.

Playing around with some onboarding designs.

I'm at a bit of a writer's block. Looking at the onboarding steps and trying to figure out best to onboard new users. There are so many moving parts, and each customer may have their own objectives. I'm thinking of adding this screen to help our app know what help sections to hide/show and to cater onboarding instructions.

Redesigned Google Sign In screen to let users choose between creating a new account or merging with existing one. More appetizing UI.

I created the functionality late, late last night, and I think I must've been dreaming about it all night because I woke up with a huge urge to make it look better.

This is looking great!

0 Likes
Simon Chiu Author

Thanks 🙏😊

0 Likes

Added Google Sign In as a login option.

So many users don't want to create yet another account. Personally, I'd rather Sign in with Google/Facebook/Twitter/Apple if I'm just thinking of checking something out.

I've added Sign in w/ Google to start, as our app is B2B.

Things I considered during this integration:
* Google Sign In for new user --> creates new account
* For existing user but unassociated Google account --> asks user to verify password to merge
* For existing user with associated account --> signs in as expected
Simon Chiu Author

The app is based on #RubyOnRails. All the logic is held in a controller that first checks the email sent back by Google in the OAuth2 response. If email exists, it gives the user a choice to merge with their existing account. If it doesn't, then redirects to the onboarding flow. (And of course if it exists and already set up, just logs the user in.) A fourth scenario would be if the email doesn't match an existing account but the user still wants to associate it with their account -- will need to address this later. It's a rabbit hole 🤷.

0 Likes

How'd you implement?

0 Likes

Added an email preference toggles in the user settings page.

Don't want users feel like they're getting too many emails, so scoping them out a bit and letting users decide what emails they want from us.

Working on a blog post to introduce our new product: Shared Inboxes for Teams.

Finished the help desk app's sidebar. Took 3 days. The last 10% of an app takes 90% effort.