diff --git a/native/navigation/app-navigator.react.js b/native/navigation/app-navigator.react.js
--- a/native/navigation/app-navigator.react.js
+++ b/native/navigation/app-navigator.react.js
@@ -6,12 +6,14 @@
 
 import ActionResultModal from './action-result-modal.react.js';
 import { CommunityDrawerNavigator } from './community-drawer-navigator.react.js';
+import CommunityDrawerTip from './community-drawer-tip.react.js';
 import { createOverlayNavigator } from './overlay-navigator.react.js';
 import type {
   OverlayNavigationProp,
   OverlayNavigationHelpers,
 } from './overlay-navigator.react.js';
 import type { RootNavigationProp } from './root-navigator.react.js';
+import { CommunityDrawerTipRouteName } from './route-names.js';
 import {
   UserAvatarCameraModalRouteName,
   ThreadAvatarCameraModalRouteName,
@@ -153,6 +155,10 @@
           name={VideoPlaybackModalRouteName}
           component={VideoPlaybackModal}
         />
+        <App.Screen
+          name={CommunityDrawerTipRouteName}
+          component={CommunityDrawerTip}
+        />
         <App.Screen name={TogglePinModalRouteName} component={TogglePinModal} />
       </App.Navigator>
       {pushHandler}
diff --git a/native/navigation/community-drawer-button-icon.react.js b/native/navigation/community-drawer-button-icon.react.js
new file mode 100644
--- /dev/null
+++ b/native/navigation/community-drawer-button-icon.react.js
@@ -0,0 +1,19 @@
+// @flow
+
+import Icon from '@expo/vector-icons/Feather.js';
+import * as React from 'react';
+
+import { useStyles } from '../themes/colors.js';
+
+// eslint-disable-next-line no-unused-vars
+export default function CommunityDrawerButtonIcon(props: { ... }): React.Node {
+  const styles = useStyles(unboundStyles);
+  return <Icon name="menu" size={26} style={styles.drawerButton} />;
+}
+
+const unboundStyles = {
+  drawerButton: {
+    color: 'listForegroundSecondaryLabel',
+    marginLeft: 16,
+  },
+};
diff --git a/native/navigation/community-drawer-button.react.js b/native/navigation/community-drawer-button.react.js
--- a/native/navigation/community-drawer-button.react.js
+++ b/native/navigation/community-drawer-button.react.js
@@ -1,27 +1,29 @@
 // @flow
 
-import Icon from '@expo/vector-icons/Feather.js';
 import invariant from 'invariant';
 import * as React from 'react';
 import { TouchableOpacity } from 'react-native';
 
+import type { AppNavigationProp } from './app-navigator.react.js';
+import CommunityDrawerButtonIcon from './community-drawer-button-icon.react.js';
 import type { CommunityDrawerNavigationProp } from './community-drawer-navigator.react.js';
+import type { NUXTipRouteNames } from './route-names.js';
 import type { TabNavigationProp } from './tab-navigator.react.js';
 import {
   NUXTipsContext,
   nuxTip,
 } from '../components/nux-tips-context.react.js';
-import { useStyles } from '../themes/colors.js';
 
 type Props = {
   +navigation:
     | TabNavigationProp<'Chat'>
     | TabNavigationProp<'Profile'>
     | TabNavigationProp<'Calendar'>
-    | CommunityDrawerNavigationProp<'TabNavigator'>,
+    | CommunityDrawerNavigationProp<'TabNavigator'>
+    | AppNavigationProp<NUXTipRouteNames>,
+  ...
 };
 function CommunityDrawerButton(props: Props): React.Node {
-  const styles = useStyles(unboundStyles);
   const { navigation } = props;
 
   const tipsContext = React.useContext(NUXTipsContext);
@@ -36,16 +38,9 @@
 
   return (
     <TouchableOpacity onPress={navigation.openDrawer}>
-      <Icon name="menu" size={26} style={styles.drawerButton} />
+      <CommunityDrawerButtonIcon />
     </TouchableOpacity>
   );
 }
 
-const unboundStyles = {
-  drawerButton: {
-    color: 'listForegroundSecondaryLabel',
-    marginLeft: 16,
-  },
-};
-
 export default CommunityDrawerButton;
diff --git a/native/navigation/community-drawer-tip.react.js b/native/navigation/community-drawer-tip.react.js
new file mode 100644
--- /dev/null
+++ b/native/navigation/community-drawer-tip.react.js
@@ -0,0 +1,20 @@
+// @flow
+
+import * as React from 'react';
+
+import CommunityDrawerButtonIcon from './community-drawer-button-icon.react.js';
+import {
+  type NUXTipsOverlayProps,
+  createNUXTipsOverlay,
+} from '../tooltip/nux-tips-overlay.react.js';
+
+const communityDrawerText =
+  'You can use this view to explore the tree of channels ' +
+  'inside a community. This shows you all of the channels you can see, ' +
+  "including ones you haven't joined.";
+
+const CommunityDrawerTip: React.ComponentType<
+  NUXTipsOverlayProps<'CommunityDrawerTip'>,
+> = createNUXTipsOverlay(CommunityDrawerButtonIcon, communityDrawerText);
+
+export default CommunityDrawerTip;
diff --git a/native/tooltip/nux-tips-overlay.react.js b/native/tooltip/nux-tips-overlay.react.js
--- a/native/tooltip/nux-tips-overlay.react.js
+++ b/native/tooltip/nux-tips-overlay.react.js
@@ -121,7 +121,7 @@
 }
 
 function createNUXTipsOverlay<Route: NUXTipRouteNames>(
-  ButtonComponent: React.ComponentType<NUXTipsOverlayProps<Route>>,
+  ButtonComponent: React.ComponentType<void | NUXTipsOverlayProps<Route>>,
   tipText: string,
 ): React.ComponentType<NUXTipsOverlayProps<Route>> {
   function NUXTipsOverlay(props: NUXTipsOverlayProps<Route>) {