Figure 6
A wireframe diagram shows a hierarchical mobile app layout with login, search, and four primary coffee supply chain modules.The diagram shows three hierarchical layers. The top layer displays two rectangular wireframe boxes. The first box on the left is labeled “LOGIN” and contains a circular user icon. The second box on the right is labeled “SEARCH” and contains a circular magnifying glass icon. Two short horizontal connector lines extend from the right and left sides of the boxes, respectively. At the bottom center of these lines, a vertical connector line extends downward, branching into four horizontal connector lines that connect to the four wireframe boxes arranged in a horizontal series in the second layer. From left to right, the boxes are labeled as follows: “ABOUT US” contains multiple small circular profile icons and horizontal rectangles representing text, arranged in a grid-like layout, with a horizontal bar at the bottom indicating interface elements. “PRODUCT LIST” displays a grid of square and rectangular placeholders; the squares are marked with an “X” and the rectangles left blank. Between the squares at the top and the rectangles at the bottom, three small circular indicators are present. “SUPPLIER” includes square checkboxes marked with an “X” and adjacent horizontal lines, representing supplier data. “FARMER DATA” consists of uniformly spaced horizontal rectangles arranged in rows, symbolizing structured data entries. Each of the four second-layer boxes connects downward via individual vertical connector lines to a corresponding wireframe box in the third and final layer. From left to right, the third-layer boxes are labeled as follows: “PLANT DETAILS” contains a large circular placeholder in the center, left and right arrows on either side for navigation, and multiple horizontal blocks above and below it. “LOGISTICS” includes a square placeholder on the left and stacked horizontal lines on the right for text or options. “WAREHOUSE” shows a grid of rectangular blocks of different sizes arranged in a grid-like pattern. “IMPORTER or EXPORTER” displays horizontal bars of varying lengths at different positions. All wireframe boxes across the three layers contain a horizontal bar at the top with three circles arranged in a horizontal series on the top left, symbolizing window controls.

Wireframe architecture of a mobile application for the coffee supply chain. Source: Authors’ own creation/work

or Create an Account

Close Modal
Close Modal