The Information Architecture (IA) for the app is designed to organize, structure, and label content in an effective and sustainable way.

The aim is to help users find information and complete tasks easily.

Here’s a few examples of the IA, with explanations of how each part benefits the user experience:

Home

Primary actions: Quick links to essential functions like nearest fuel station, current promotions, and recent orders.

Quick overview: Dashboard showing loyalty points balance, recent activity, and personalized greetings.

Explanation: The Home section acts as a central hub, providing a snapshot of the most relevant and frequently used features, saving time and enhancing convenience.

Fuel services

Find fuel: Locator for nearby stations with map and list options.

Fuel pricing: Real-time prices for various types of fuel.

Mobile payment: Integrated payment solutions for refueling.

Explanation: Organizing all fuel-related activities under one category simplifies the user’s search process, enabling quick decisions and transactions directly related to fueling needs.

Store offerings

Product categories: Divided into snacks, beverages, groceries, etc.

Promotions: Current deals and discounts.

Mobile ordering: Order ahead and pick-up at store.

Explanation: This section helps users explore the store's offerings systematically, improving the online shopping experience and driving sales through easy access to promotions.

Account & settings

Profile management: Edit personal information and payment methods.

Order history: Review past purchases and repeat orders.

App settings: Adjust notifications, app theme, language, etc.

Explanation: Centralizing account management and settings provides users with control and visibility over their personal data and app interactions, fostering a sense of security and personalization.

Location services

Store finder: Search for all store locations with detailed information.

Favorites: Save frequently visited locations.

Amenities information: Availabilities like ATMs, restrooms, etc.

Explanation: Enhances user navigation and planning capabilities, making it easy to access services when on the move.

Rewards & promotions

Loyalty points system: Details on how to earn and redeem points.

Exclusive offers: Special promotions for app users.

Seasonal campaigns: Limited-time events and offers.

Explanation: This section aims to increase user engagement and loyalty by gamifying the experience and offering tangible benefits.

The IA aims to create a clear, user-friendly structure that aligns with the mental models typical convenience store and fuel app users might have.

Each category is designed to facilitate quick access to the most relevant information and functions, encouraging greater app usage and improving overall satisfaction.

As a content designer, my wireframe process starts with analyzing the user flow to ensure an informed and content-first design approach. Beginning with low-fidelity sketches and evolving into digital formats, I prioritize content elements based on user needs.

Throughout, collaboration with peers ensures the alignment of design with usability and business objectives, making the wireframes a robust blueprint for developers.

Key Steps in my wireframe design process:

Analyze user flow: Started by understanding the user interactions and basing the initial designs on this foundation.

Sketch and prioritize content: Initially used low-fidelity sketches to experiment with content placement and hierarchy.

Digitize wireframes: Transitioned sketches to digital tools for refinement and adjustment of layouts and navigation structures.

Collaborate for feedback: Engaged with other designers, developers, and stakeholders to refine the designs and ensure they met user needs and project goals.

Finalize design: Ensured the final wireframes effectively blended usability with a strong content-driven focus.

I crafted a comprehensive content style guide covering the following areas. For each area, the guide provides a clear introduction, detailing the specifics included, alongside examples illustrating correct versus incorrect applications:

Brand voice and tone

Grammar

Capitalization

Punctuation

Visuals

Active voice

Abbreviations and acronyms

Cultural sensitivity

Social media

Legal and ethical considerations

Visual guidelines

Structure and hierarchy

Numerals

Glossary of terms

Developing a nomenclature for a convenience store and fuel app is about defining a clear set of terms and labels that organize app content into logical sections to improve the user interface.

Effective nomenclature tells users what they can find and do within the app. Below are some examples of nomenclature tailored for the app, which is aimed at providing straightforward navigation and enhancing the overall user experience:

Fuel

Location search: Helps users locate nearby stations.

Sort: Allows filtering by fuel type and amenities.

Price check: Displays current fuel prices.

Pay at pump: Mobile payment for fuel.

Pump options: Choose your pump and fuel type.

Payment method: Manage credit cards, app wallet, or discounts.

Shop

Products: Browse items by category.

Food & drinks: Snack, drink, and prepared food options.

Auto items: Car essentials and accessories.

Home products: Emergency supplies and batteries.

Deals: View current specials and discounts.

Order ahead: Place orders remotely for pickup.

Shopping list: Make and share a list of items to buy.

Account

Profile: Edit personal information and settings.

Payment method: Save and manage how you want to pay.

Purchase history: Review past transactions.

Notifications: Set preferences for app alerts.

Help: Access FAQ and contact support.

Rewards

Loyalty program: Join or manage your rewards account.

Promotions: Get the latest deals.

Earn points: Learn how to get more points.

Redeem points: Use points for items or discounts.

This nomenclature focuses on straightforward, easy-to-understand titles that reduce complexity and enhance the user experience by providing clear guidance on where to find services and how to use features within the app.

Below is a breakdown of my writing process, followed by an outline of my iteration process.

My writing process

Drafted initial content: I started by crafting the initial drafts for app text. This involved creating text for elements such as navigation, instructions, error messages, labels, push notifications, and informational content within the app. I prioritized clarity and conciseness to guide users efficiently.

Actionable language: I made an effort to use verbs and phrases that motivated user action and facilitated task completion, preferring dynamic wording like "Choose your fuel" over more static options.

Consistency: I maintained consistent terminology throughout the app to prevent user confusion. For example, if I decided on "Top up" for adding funds, I ensured it was used consistently.

User-centered approach: I focused on addressing the users' perspectives and needs in my content, emphasizing what users could achieve with the app, such as encouraging them to "Get started with your first fuel reward."

Microcopy and interface language: When creating microcopy for transactions, I aimed for skimmability and straightforwardness, knowing that users often quickly scanned these texts.

Accessibility: I wrote content that was accessible to all users, including those with disabilities. This involved using clear language and providing alt text for images.

My iteration process

Feedback incorporation: I gathered feedback on my drafts from team members, stakeholders, and during user testing sessions, remaining open to different opinions to refine my content.

User testing: I conducted guerilla-style testing with users using prototypes or wireframes with my text, noting their interaction and any points of confusion.

Refining content: Based on feedback and observations from testing, I refined my content. This involved simplifying language or rearranging information to improve logical flow and integration within the user interface.

A/B testing for conversion optimization: I requested A/B testing for essential sections of the app, like calls-to-action, to determine which versions led to better user engagement. However, due to a limited budget, I was unable to carry out these tests.

Legal and compliance check: I ensured that any content relating to user transactions and data was legally compliant, consulting with legal teams when necessary to ensure accuracy and transparency.

Localization considerations: In preparing content for multiple regions, I considered the need for localized content adjustment based on regional responses to specific phrasing or calls-to-action.

Focusing on a writing and iteration process that emphasized user engagement, clarity, and legal compliance, I enhanced the functionality and user experience of a fuel and convenience store app, creating an intuitive and enjoyable user interface.