Obumuneme Nwabude
GDE Dart & Flutter
Actions
Obum is a Google Developer Expert (GDE) in the Dart & Flutter category. He is also a Full-Stack Blockchain and Web developer with professional frontend, backend, and web3 experiences. He has written several articles on Flutter in various publications and volunteers in tech communities.
Awards
Area of Expertise
How AI improves User Experience on Mobile
The aim of this session is to encourage builders and developers to leverage AI responsibly in their products by explaining the benefits of doing so. These benefits include user productivity, personalization, cheap cost, improved speed, and developer experience (an indirect benefit). While deep diving in each benefit of AI in mobile devices, we will also mention legal and security touchpoints in the building and usage processes.
For user productivity, AI can be used in generative sections of apps like replying to text, interacting with customer support, generating hash tags, etc. For personalisation, AI can make the user happier with search or content suggestions peculiar to users' preferences. Furthermore, we can make UI controls to change their positions based on how AI detects users' usage at runtime.
The cheap cost benefits is in cases of users with AI-powered chipsets. These devices can carry out some AI computations that we would have rather sent to the server. Same is with the benefit of improved speed. Since executions are on-device, there is an overall faster experience and mobile device users are happier.
AI faciliates development by suggesting code snippets and carrying-out some minor developer tasks as we see with Gemini in Android Studio. Since developers' experiences get improved by AI, the developers can build more and ship faster, hence leading to improved User Experiences.
Comment l'IA améliore l'expérience utilisateur sur mobile
Cette session servira à encourager les développeurs à exploiter l'IA dans leurs produits en expliquant les bénéfices de tel engagement. Ces bénéfices comprennent la productivité de l'utilisateur, la personnalisation, le faible coût, la vitesse améliorée et l'expérience du développeur (un avantage indirect).
Pour la productivité de l'utilisateur, l'IA peut être utilisée dans les fonctionnalités génératives comme la messagerie, l'interaction avec des services clientèle, générer des hashtags, etc. Pour la personnalisation, l'IA peut rendre l'utilisateur plus heureux avec des suggestions de recherche ou de contenu à leur préférence. De plus, nous pouvons modifier quelques parties des applis (comme la position des boutons) avec l'IA dans le but de retenir les utilisateurs.
Les avantages en termes de coût sont dans le cas des utilisateurs qui possèdent des chipsets intégrés à l'IA. Ces appareils peuvent effectuer certains calculs d'IA qu'avant maintenant, nous avons dû envoyer au serveur. Il en va de même pour l'avantage de la vitesse améliorée. Étant donné que les exécutions sont sur l'appareil, l'expérience est globalement plus rapide et les utilisateurs d'appareils mobiles sont plus satisfaits.
Bringing Blockchain & Web3 into Flutter
Blockchain & Web3 power decentralized applications in browsers. On mobile devices, we can add them into our Flutter Apps to give users a better experience and hence increase user retention.
Whether your app's core features are blockchain-related, or whether you are using crypto for payments, or you want to add these functionalities in your existing applications: there is a place for you with Flutter.
This session will start with a quick overview of blockchain and web3 and then showcase successful large-userbase apps that are built with Flutter and also provide crypto features.
From there, we will discuss how to use web3 for Authentication and handling wallet connections. In addition, participants will learn how to read from and write to the blockchain with smart contract calls directly within Flutter.
Furthermore, we will explore the combinations of your custom server's API calls with the above blockchain methods for backend interactions, depending on your app's features.
We will then round up with hinting on security and on improving user experiences by reacting to Smart Contract Events and integrating deep links (if need be) in your Flutter applications.
Dart Macros and a Better Flutter
In line with Flutter updates at Google I/O this year 2024, this session would be about the latest from Dart and Flutter. These latest are as follows:
1. Macros in Dart
2. Gemini Google AI
3. Games in Flutter
4. Impeller in Android
5. WebAssembly for Flutter Web
Macros are an entirely new feature to the Dart programming language. They are like decorators in TypeScript. They are more performant because they evaluate at coding time through Dart analyzer, so this is an improved developer experience in the overall ecosystem. Though macros are still in beta and not yet publicly availalble, we can experiment with it.
The first part of this session will demo Macros to build enthusiasm with the new feature.
After that, we will now showcase the other new features in Flutter. How Gemini can power AI features, how Flame (Flutter-based game engine) can build games, how Impeller is now in Android and can improve performance, and lastly for Flutter Web now has WebAssembly and it is way faster than JavaScript.
How to customize a Flutter package to suit your needs
Dart and Flutter have more than 20000 packages on pub.dev. These are open-source packages developed by the huge Flutter community.
At times, some packages might not fulfill what you want. You might need extra customizations.
In this session, we will look at how to access a package's source code. We will also look at how to analyze and understand the source code.
Finally, using Fluttertoast package as an example, we will look at customizing any Dart package to suit your needs.
This session is adapted from an article I published earlier on SweetCode at https://sweetcode.io/how-to-customize-flutter-packages-to-suit-your-needs
How Flutter CustomPaint resembles SVG Image Spec
SVG is Scalable Vector Graphics. It is HTML & CSS code that draws animations, arcs, colors, lines, shadows, shapes, text, etc.
It is an image specification that renders any image with the same clarity, irrespective of the viewport size.
Flutter has the CustomPaint widget. With CustomPaint, you specify how painting should be done in every detail as if on a canvas.
Turns out that CustomPaint's APIs and methods closely resemble the SVG Image Spec.
Just as with SVG, you can specify animations, arcs, colors, lines, shadows, shapes, text, etc. all in CustomPaint. There are options you don't get with the basic Container widget.
In this session, the audience will learn more about both CustomPaint and SVG. They will learn these complex UI tools from the angle of their features.
We will show a side-by-side comparison of achieving the same complex UIs with both tools.
Using Streams and Services for Flutter State Management
In Dart, Streams continuously emit values.
In Flutter, we can create service classes. These services are globally available singletons that can keep track of values.
In your Flutter codebase, you can combine them such that services expose stream(s), while at the same time emitting values to those stream(s).
In the UI, you can use StreamBuilders to auto-update the UI when the streams emit values. Also, services can listen to changes in streams of other services.
The above is a neat App-Wide State Management architecture you can use in any Flutter codebase (irrespective of the large scale).
You can use it in place of other state management architectures that come with performance issues. learning curves, and many dependencies.
In this session, the audience will get to understand the above with a simple demo of the Counter App.
As a bonus, the session will also explain how to navigate from anywhere using the above architecture.
Understanding UI Rendering: How Flutter is platform-agnostic
Flutter as a mobile framework achieves cross-platform ability through 2 ways: UI Rendering and Platform Channels.
In this session on UI Rendering, the audience will understand how Flutter is capable of painting the exact same UI across any device or platform.
Event participants will also understand how Flutter is capable of keeping to the promised 60 frames per second, given that Flutter uses some rendering canvas for each device.
Finally, we will explore some tips on how to implement any UI in Flutter as a bonus.
How to improve Flutter Forms
Forms are how we collect input from users in our apps. We should improve forms to give users a good experience in our app.
Improving Flutter Forms involves:
* Overall UI of the Forms
* Proper Input Validation Messages
* Toggling obscureText on password fields
* Making other input types to be fields (dropdowns, pickers, and radios)
* Autofill where necessary
* KeyBoard Types for each input field type
* Having onSubmit for the Enter key
* Disabling Fields when the form is submitting
* Loading UI feedback for when the form is submitting
This article tells the full story https://dev.to/obumnwabude/how-to-improve-flutter-forms-ni3
How to animate in Flutter
- On using built-in animated equivalents of most widgets.
- On managing animations yourself with AnimationController or built-in transitions.
- On setting up animations yourself with AnimatedWidget or Animated holder.
- On using CustomPaint
- On using third party packages like Lottie or Rive.
Flutter for Web Developers
The aim of this session is to show the concepts that a web developer can transfer over when learning Flutter and the things that will be new to him/her.
At the end of the session, it is expected that web developers in the audience will be more willing to try Flutter because they would have understood the things they don't need to learn again and figure out what might be a hurdle for them.
For concepts that transfer over, the following have similarities in front-end web development and Flutter:
1. Implementing User Interfaces.
2. Coding for Multiple Screen Resolutions.
3. Working with developer tools.
For concepts that will be new to a web developer:
1. Handling Scrolling yourself.
2. Setting Up developer environment.
3. Packaging and Deployment.
This session is adapted from an article I previously published on CSS-Tricks at https://css-tricks.com/flutter-for-front-end-web-developers/
Scrolling Insights: Flutter vs CSS
In browsers, with HTML and CSS, scrolling is active by default. HTML elements auto-scroll when there is need for that. On the other hand, in mobile apps, when coding for Android & iOS, you must be intentional about what should scroll. As Flutter builds for these platforms, it is inherently constrained to “intentional scrolling”. This is especially technical when you want to implement specific scrolling flavors.
In this session, we will simultaneously look at how to achieve the following scrolling behaviors in Flutter and in CSS (side-by-side comparison):
* How to scroll (you have to use Scrollable widgets)
* How to scroll horizontally (Axis.horizontal)
* How to achieve nested scrolling (slivers and shrinkWrap)
* How to pin some items when you scroll (combining slivers)
* How to occupy free space while allowing scrolling too (SliverFillRemaining)
* How to prevent the user from scrolling (NOT using Scrollable Widgets)
Expert Tips for Flutter UI Performance
Flutter as a UI framework powers devices and renders animations fast and without jank. Performance is core to Flutter and has been the reason for continuous optimizations and improvements.
However, aside from the framework's actions, the developer/builder of the Flutter app also has a role to play in the performance of Flutter's UI in their apps. They have to collaborate with the framework and not fight it to achieve the best performant UI ever.
In this session, we will go through expert tips that anyone building Flutter must take into account when working with UI code. They are as follows:
* Use widgets instead of functions that return them
* Use "const" keyword where obtainable
* Cache images after they are fetched
* Cache results of computation
* Use Isolates when needed
How to Build Android Bubbles in Flutter
Conversation Bubbles are an Android 11+ OS-level feature. They allow users to interact with chats from various apps simultaneously.
Building the Bubbles feature in an Android application requires a tight integration with notifications. In addition, you need to provide "dynamic Shortcuts" and "Persons" for every bubble displayed to the Android system. These make it demanding to build in Flutter because of the heavy MethodChannels usage and the extra work to do in Android's native side (Kotlin).
During this technical workshop session, the audience will learn how they can integrate the Android Bubbles feature in a given Flutter application. The session will start with explaining the feature, showcasing its proposed value, and brainstorming on other unexplored apps that can use it (like customer support, multi-session multiplayer gaming, and real-time monitoring of trades).
Next, we will deeper explain the prerequisites for an application to show bubbles. From there, we will go through the core things we need to handle or provide from Flutter to Android to ensure that users can interact with Bubbles in Flutter apps as if they were Android native apps.
There will be a demo of the code and how it works during the workshop. Finally, we will look at the User Experience Best Practices to follow while using the Bubbles feature especially as users can opt out of notifications at any point in time.
How to use Google AI for A/B Testing
A/B Testing drives engagement because it gives provides a user-based methods of rolling out features. In other words, we publish features if users like them.
However, manually segmenting the user base is not optimum. We can't tell if users in a given test group or experiment are the right fit for a new feature. This is where Google’s AIs come in.
We can use Vertex AI Gemini API in our applications to learn about our users better than plain analytics Data. We can the use Firebase GenKit on the server-side to know which users will receive a set of experiments with predictive analysis.
In this session, we will look into how to use Google AIs to understand our users, give them what they want and hence more user retention and increased sales.
DevFest Kaduna 2024 Sessionize Event
FlutterBytes Conference 2024 Sessionize Event
Google IO Extended Asaba Sessionize Event
DevFest Asaba 2023 Sessionize Event
Devfest Enugu 2023 Sessionize Event
DevFest Abakaliki 2023 Sessionize Event
Google I/O Extended Owerri Sessionize Event
Google IO Extended Enugu '23 Sessionize Event
Google I/O Extended Onitsha Sessionize Event
Flutter Forward Enugu Sessionize Event
Please note that Sessionize is not responsible for the accuracy or validity of the data provided by speakers. If you suspect this profile to be fake or spam, please let us know.
Jump to top