Contact Poster Pro

Overview

Contact Poster Pro is a photo effects app tailored for Apple’s iOS 17 Contact Poster feature. The app enables users to create visually stunning call screens and contact posters using AI-powered effects. Designed with Apple’s aesthetic and usability principles, the app combines professional UI/UX design with robust creative tools. It offers features such as depth-effect-ready templates, AI-powered enhancements, and a variety of visual styles, making it a versatile tool for personalizing the iOS call screen experience.

As the designer, I was responsible for creating the app’s user flow, UI, and effects. This included designing assets in Photoshop and ensuring adherence to Apple’s design best practices to achieve a seamless and authentic user experience.

Design Approach

Framework: Apple’s Human Interface Guidelines (HIG)

The design process was aligned with Apple’s Human Interface Guidelines, emphasizing:

1. Clarity: Ensuring every element serves a clear purpose.

2. Deference: Allowing content to take center stage.

3. Depth: Creating a sense of hierarchy and visual delight.

Key principles from HIG guided the development of the user interface, interaction design, and visual style.

User Persona

Persona Name: Alex Johnson

• Age: 24

• Occupation: Photographer

• Location: San Francisco, CA

• Goals:

  • Personalize iPhone contact screens to reflect their creative personality.

  • Create unique, visually appealing contact posters for themselves and friends.

  • Use AI tools for efficient photo editing.

• Pain Points:

  • Limited customization options in native iOS tools.

  • Desire for high-quality effects without advanced editing skills.

  • Need for intuitive tools that don’t overwhelm with complexity.

Empathy Map

What Alex...

• Thinks:

  • “I want my call screen to stand out and look professional.”

  • “It should be easy to create polished designs without spending hours editing.”

• Says:

  • “I love exploring creative apps, but they’re often too complicated.”

  • “I wish I could add depth effects without worrying about technical details.”

• Does:

  • Experiments with different apps for photo effects and editing.

  • Spends time on aesthetic details but avoids overly complex workflows.

  • Shares creative work on social media to showcase individuality.

• Feels:

  • Excited by the prospect of unique visual customization.

  • Frustrated by apps that don’t meet design expectations or ease of use.

  • Confident when using tools that enhance creativity effortlessly.

User Flow

The app’s user flow was designed for simplicity and efficiency:

1. Onboarding

   • A brief tutorial introduces users to key features like AI effects, depth-effect templates, and customization tools.

   • Users can explore example designs for inspiration.

2. Photo Selection

   • Users upload or select a photo from their library.

   • Basic adjustments like cropping and resizing are available for optimal poster layout.

3. Effect Application

   • AI-powered effects are categorized (e.g., Blurry, Motion, Colored).

   • Preview mode allows users to test multiple effects before finalizing.

4. Poster Customization

   • Users can adjust text styles, colors, and placement for a cohesive look.

   • Depth-effect preview ensures compatibility with iOS 17’s features.

5. Save and Share

   • Users save the final poster to their library or set it directly as a Contact Poster.

   • Sharing options include exporting as wallpapers or posting on social media.

Wireframes and Prototypes

Using Figma, I created wireframes and prototypes to outline the user journey:

• Home Screen: Features quick access to photo selection and recent projects.

• Editing Interface: Simplified layout with tools for applying effects, customizing text, and adjusting layouts.

• Preview and Save: Real-time previews with iPhone mockups to visualize the poster in action.

Key Design Features:

• Intuitive Controls: Drag-and-drop functionality for text and image placement.

• Responsive Design: Optimized for both portrait and landscape orientations.

• Layered Effects: Support for depth effect with adjustable opacity and layers.

• One-Step Editing: The editing screen is highly intuitive and simplifies the process to a single step, making it the epitome of user-friendly interface.

Challenges and Solutions

1. Challenge: Balancing professional-grade effects with ease of use.

   • Solution: Used AI to automate complex edits while giving users manual override options for precision.

2. Challenge: Ensuring designs align with Apple’s aesthetic.

   • Solution: Followed Apple’s HIG closely, using familiar UI patterns and design principles.

3. Challenge: Supporting depth effects seamlessly.

   • Solution: Developed templates with predefined layers that align perfectly with iOS 17’s depth features.

4. Challenge: Keeping users engaged over time.

   • Solution: Introduced new and exclusive effects regularly, ensuring the app remains updated and useful.

Final Design

The final design emphasizes simplicity, creativity, and authenticity:

• Clean UI: Reflects Apple’s design style with clear typography, smooth animations, and subtle gradients.

• Engaging Effects: A wide range of AI-powered visual effects, including options tailored for depth effects.

• Customizable Templates: Users can easily personalize posters with text, colors, and layered effects.

• One-Step Workflow: Editing is streamlined into a single, user-friendly step.

• Regular Updates: New and exclusive effects keep the app fresh and engaging for users.

Results and Impact

Initial user feedback highlighted the app’s ease of use, aesthetic appeal, and innovative features:

• Usability: Testers appreciated the intuitive flow from photo selection to poster creation.

• Creativity: Users were impressed by the range of effects and customization options.

• Alignment with iOS 17: The app’s depth-effect compatibility was a standout feature, making posters look professional and dynamic.

Conclusion

Contact Poster Pro demonstrates how adherence to Apple’s design principles and innovative use of AI can create a powerful yet simple tool for iOS personalization. This project emphasized the importance of balancing functionality with usability, ensuring that even advanced features remain accessible to all users. Moving forward, updates will focus on expanding the effect library and integrating user feedback for continuous improvement.