APPLE

1. Project Overview

  • Type: High‑end online magazine / newsletter platform
  • Brand: إبن إنس (investment insights)
  • Goal: Deliver rich, magazine‑style content—articles, sector deep dives, interviews—while driving subscriptions and engagement

2. Design Requirements

  • Layout:
    • Homepage: Hero carousel, featured stories, sections by topic (Markets, Analysis, Interviews, Opinion)
    • Article Pages: Full‑width header image, large headline, byline, social‑share bar, “Related Reads” at bottom
    • Category / Section Pages: Grid / list of articles with infinite scroll or pagination
    • Magazine Elements: Pull‑quotes, photo‑essays, sidebar widgets (Top Stories, Latest Updates)
    • Responsive: Seamless on desktop/tablet/mobile (mobile‑first philosophy)
  • Style Guides:
    • Typography: Elegantly pair a serif headline font (e.g., “Playfair Display”) with a clean sans (e.g., “Tajawal” or “Roboto”)
    • Colors: Dark charcoal backgrounds + bright accent (#ff4301) for highlights, CTAs
    • Whitespace & Grid: Balanced, modular grid (NYT‑style column widths)
  • Moodboard / References:
    • New York Times.com (desktop + mobile)
    • Quartz, The Economist digital edition

3. Core Functionality

  1. CMS & Editorial Workflow:
    • WordPress (or headless WordPress) with custom post types for Articles, Interviews, Reports
    • Roles/permissions (Editor, Author, Contributor)
  2. Homepage & Navigation:
    • Mega‑menu with drop‑downs for main categories
    • Sticky header + search bar
  3. Article Templates:
    • Featured image + title overlay
    • Author box with photo + bio + social links
    • Inline related links, footnotes, “You May Also Like”
  4. Dynamic Sections:
    • “Latest Updates” ticker bar (pre‑market audio blurbs)
    • “Deep Dive” premium section behind paywall
  5. Subscription & Paywall:
    • Integration with MemberPress / Paid Memberships Pro (Arabic support)
    • Free tier vs. Premium tier gating for “Deep Dive” content
  6. Newsletter Signup & Distribution:
    • Pop‑up or inline forms (Mailchimp, Sendinblue)
    • Automated daily “Top 5” email with excerpted headlines
  7. Advertising / Sponsorship Slots:
    • In‑article banner zones, sidebar ad units (responsive)
  8. Social & Sharing:
    • Open Graph tags, Twitter Cards
    • Social‑share icons fixed or floating
  9. Performance & SEO:
    • Fast loading (lazy‐load images, optimized critical CSS)
    • Schema.org markup for articles, breadcrumbs
  10. Analytics & A/B Testing:
    • Google Analytics 4 + Hotjar or similar
    • Setup experiments on headlines, layouts

4. Technical Stack & Deliverables

  • Platform: WordPress (PHP 8.x), or headless WP + React/Vue frontend
  • Frameworks/Libraries: Bootstrap 5 (or Tailwind CSS), jQuery optional
  • Code Quality:
    • Child‑theme or custom theme, no core hacks
    • Well‑documented, modular CSS (BEM or utility classes)
  • Deliverables:
    • Fully functional staging site
    • Deployment instructions (Git, FTP, or SSH)
    • Documentation for editors (how to add stories, manage paywall)

5. Timeline & Budget

  • Estimated Duration: 6–8 weeks (design → development → QA → launch)
  • Milestones:
    1. Wireframes & style tiles (1 week)
    2. High‑fidelity mockups (2 weeks)
    3. Frontend + WordPress integration (3–4 weeks)
    4. Testing & revisions (1 week)
  • Budget Range: Depends on scope, but expect USD 5,000–10,000 for a polished, magazine‑quality build

6. Required Freelancer Skills

  • Proven experience with magazine/news themes and large‑scale WP sites
  • Strong UI/UX sense, typography, responsive design
  • Familiarity with Arabic RTL layouts
  • Experience integrating membership/paywall systems
  • Good communication (English/Arabic) and documentation
share
en_USEnglish