Page MenuHomePhabricator
Create Task
Maniphest T113001

Update styling and grouping of cards on feed for iOS app 5.0
Closed, ResolvedPublic3 Story Points
Actions

Description

Update styling for the feed. here's a the spec for the feed styling that @KHammerstein and I worked on

  • M83 Feed styling spec
    30

    • Acceptance criteria:
    Article Preview Card View layout in portrait mode should match the attached pholio mockup.

    Note that if an article doesn't have a valid lead image, no image is shown. See spec for details on other details of Article Preview Card View behavior.

    Related Objects
    Search...

    Event Timeline

    Nirzar created this task.Sep 17 2015, 11:21 PM
    Nirzar updated the task description. (Show Details)
    Nirzar raised the priority of this task from to Needs Triage.
    Nirzar assigned this task to Fjalapeno.
    Nirzar added a project: Wikipedia-iOS-App-Development.
    Nirzar added a mock: M83: Feed styling spec.
    Nirzar added subscribers: Aklapper, MBinder_WMF, • MSyed and 4 others.
    Nirzar removed Fjalapeno as the assignee of this task.Sep 18 2015, 6:10 PM
    Nirzar set Security to None.
    JMinor added a comment.Sep 24 2015, 8:41 PM

    @Nirzar @KHammerstein please attach pdf assets for the new icons for feed sections.

    Nirzar updated the task description. (Show Details)Sep 25 2015, 5:22 PM
    Nirzar added a comment.Oct 1 2015, 5:51 AM

    @JMinor the assets for this have been added to https://phabricator.wikimedia.org/M91

    The only one that is not there is the placeholder icon for images. here https://phabricator.wikimedia.org/M83/223/

    So attaching the icon PDF here for that

    image-placeholder.pdf4 KBDownload

    Mhurd moved this task from Tasks from Product Backlog to Doing on the Wikipedia-iOS-App-Development board.Oct 2 2015, 12:00 AM
    Mhurd claimed this task.
    Mhurd added a comment.Oct 2 2015, 12:22 AM

    @Nirzar Hey I'm starting on this ticket in the morning - are the attached assets still good to go?

    • BGerstle-WMF added a subscriber: • BGerstle-WMF.Oct 2 2015, 6:57 PM

    @Mhurd see if T113757 is fixed as a result of this styling

    Mhurd added a comment.Oct 7 2015, 8:54 PM

    @Nirzar @JMinor

    This PR implements the most obvious changes specified in the "treatment" mock - i.e. moving the title description below the image, edge-to-edge spacing, removing drop shadow etc:
    https://github.com/wikimedia/wikipedia-ios/pull/148

    I am starting on follow-on now to address all of the tiny padding, font-size/color and other smaller bits from the other mocks.

    Mhurd added a comment.Oct 7 2015, 11:54 PM

    @Nirzar - hey in Treatment.png, should we use same blue for both collection title (i.e. "Edward norton" ) and "Save for later"? Right now they're slightly different...

    Mhurd added a comment.Oct 10 2015, 2:41 AM

    Style updates cleaning up summary text and reducing vertical spacing between items:
    https://github.com/wikimedia/wikipedia-ios/pull/153

    • KHammerstein added a comment.Oct 20 2015, 12:37 AM

    @Mhurd
    Image height incorrect - should be a 16:9 ratio. On iphone 6 ~ 192 pt

    JMinor updated the task description. (Show Details)Oct 22 2015, 10:28 PM
    Etonkovidova added a subscriber: Etonkovidova.Nov 25 2015, 10:37 PM

    Checked with 5.0.0.520 on iPad mini iOS 8.2 and iPhone 5 iOS 9.02
    Checked with 5.0.0.520 on iPhone 6S+ 9.1

    iPad mini iOS 8.2

    iPhone 6S 9.1

    iPhone 5 iOS 9.02

    Restricted Application added a subscriber: StudiesWorld. · View Herald TranscriptNov 25 2015, 10:37 PM
    JMinor closed this task as Resolved.Dec 3 2015, 12:32 AM
    Content licensed under Creative Commons Attribution-ShareAlike 3.0 (CC-BY-SA) unless otherwise noted; code licensed under GNU General Public License (GPL) or other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL